Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Page 1 of 2 1 2 LastLast
Results 1 to 10 of 15
  1. #1
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    I've recently continued desining this website for fun and maybe future use and i'm having a few problems.

    On Chrome it looks just like it should. Everything is almost perfect. On FF however most of the dives/elements are about 20 px lower then they should be. Why is FF doing this? FF and Chrome are pritty good with code and should be almost identical. I have tryed to fix this problem with a simple javascript code to switch the css files depending on browser but that doesn't work because both browser code names are netscape. How can I fix this

    Link: http://iztudioz.hostei.com/index.html

    Thanks for the help.
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  2.  

  3. #2
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    Without really digging into the code, try using a CSS reset. Eric Meyer has a great one.
    AlphaMare likes this.
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  4. #3
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    Quote Originally Posted by Ronald Roe, post: 215361
    Without really digging into the code, try using a CSS reset. Eric Meyer has a great one.
    How can this help me?
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  5. #4
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    Quote Originally Posted by Andrew Yurlov, post: 215366
    How can this help me?
    It will help you see where the problem is. Go down the list, and you will figure it out.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  6. #5
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    Quote Originally Posted by George Dolidze, post: 215367
    It will help you see where the problem is. Go down the list, and you will figure it out.
    Thanks il try it out.
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  7. #6
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    Hold on I don't really get how to use it... what am I supposed to do?
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs



  8. #7
    WDF Staff George Dolidze's Avatar
    Join Date
    Apr 2011
    Location
    Irvine, CA
    Posts
    2,487
    Member #
    27540
    Liked
    416 times
    I suck at explaining things. I'll let Ronald take this.
    My freelancer website: DolidzeDesign



    You only need a parachute if you plan on skydiving twice.

  9. #8
    Senior Member Ronald Roe's Avatar
    Join Date
    Mar 2011
    Location
    Oklahoma City
    Posts
    3,141
    Member #
    27197
    Liked
    959 times
    ...And here I am. A CSS reset clears settings that are particular to the various browsers. I.e., Firefox has a given default margin for divs. So does Chrome, IE and every browser. It's called the User Agent Stylesheet. Because browser manufacturers are different, so are the settings. A reset takes those settings and zeroes them out, or sets them to a known value across the board.

    To use it, just load it like a normal stylesheet BEFORE your own styles. Many times this will clear up your cross-browser alignment issues. I use a custom reset on every design so I know I'm working with a clean-ish slate.
    Ron Roe
    Web Developer
    "If every app were designed using the same design template, oh wait...Bootstrap."

  10. #9
    Member Janja's Avatar
    Join Date
    Aug 2011
    Location
    Vista, CA
    Posts
    54
    Member #
    28823
    Liked
    3 times
    Andrew, even though resetting the css will help, you might still need two style sheets for IE and Firefox. One of the main issues between the two is that if you use padding anywhere for example on a content box, FF will add the padding within that width of the box while IE puts the padding on the outside making the box wider.
    Your problem seems to be with margins, so it's probably fixed but it's good to know for the future.

  11. #10
    Senior Member Andrew Yurlov's Avatar
    Join Date
    Apr 2011
    Location
    Portland, OR
    Posts
    1,306
    Member #
    27566
    Liked
    181 times
    Quote Originally Posted by Ronald Roe, post: 215374
    ...And here I am. A CSS reset clears settings that are particular to the various browsers. I.e., Firefox has a given default margin for divs. So does Chrome, IE and every browser. It's called the User Agent Stylesheet. Because browser manufacturers are different, so are the settings. A reset takes those settings and zeroes them out, or sets them to a known value across the board.

    To use it, just load it like a normal stylesheet BEFORE your own styles. Many times this will clear up your cross-browser alignment issues. I use a custom reset on every design so I know I'm working with a clean-ish slate.
    Well I tryed this out and It didn't work...
    This is what I did. Just to make sure I did it right.

    1)Make all the pages load the css reset css file. (e.x css/css_reset.css)
    2)Reload my website on FF and Chrome.
    3)Make all my pages once again load the original css file.
    4)Reload my website on FF and Chrome and see if it works.

    What did I do wrong, and did I even do what im supposed to...
    Im kinda lost. What should I do now?
    Artificial intelligence is nothing compared to natural stupidity -Someone

    Design is a funny word. Some people think design means how it looks.
    But of course, if you dig deeper, itís really how it works.
    -Steve Jobs




Page 1 of 2 1 2 LastLast

Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
All times are GMT -6. The time now is 08:30 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com