Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Page 1 of 2 12 LastLast
Results 1 to 15 of 21
  1. #1
    New Coder
    Join Date
    Feb 2008
    Posts
    32
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Unhappy CSS positioning in IE, Firefox

    Hello! I'm having a problem to where, no matter what I do or what I try, I cannot get my navigation (which is coded in CSS and javascript) to align properly with the main content border. Right now, it looks perfect in Firefox, but in IE, it's overlapping the content div by anywhere between 5-10 pixels. I've tried everything there is to try under the sun, and I have no success.)

    http://www.nevaehssweetestjoys.com/realestate/index.htm

    Please view the source of my page to review the coding...

    I really think it's just a CSS problem, which is why I posted this thread in this forum, but if anybody could help me, that would be lovely. Actually, it'd be tremendous!

  • #2
    Regular Coder
    Join Date
    Jun 2007
    Posts
    805
    Thanks
    123
    Thanked 23 Times in 23 Posts
    You have no doctype.
    You have not validated your page.
    Your CSS should be in an external stylesheet.
    And I guess the problems would be solved, if you used margins to position things instead of position:absolute;.

  • #3
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    you have your navigation positioned absolute! Which means if i have a different resolution or make my windo smaller the navigation will move and be in a different place.

    you need a doctype in your html first then you need to add this to your css

    Code:
    * {
    margin:0px;
    padding:0px;
    }
    then adjust the navigation, let us know of anymore questions!

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Quote Originally Posted by jcdevelopment View Post
    Code:
    * {
    margin:0px;
    padding:0px;
    }
    then adjust the navigation, let us know of anymore questions!
    You don't need the units in that. 0 is 0.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    so 0 will just input it even if you are working in em's? I thought you had to specify a type of dimension no matter what? Huh, you learn something new each day! Thanks!

  • #6
    Regular Coder
    Join Date
    Jan 2008
    Location
    Willow Grove, PA
    Posts
    169
    Thanks
    1
    Thanked 27 Times in 27 Posts
    You don't need the units. But I personally like to use them anyway. My thinking is that is 1 less rule that I have to worry about. And that it might confuse people coming in to CSS fresh.

    "How come I see margin: 75px but margin: 0 somewhere else?"

    At least if you always specify a unit you won't get a question with that.

    Same thing goes with color: #000 and color: #000000. The first time I saw that I was confused as crap. Shortcuts should be intuitive....not confusing. So I don't use those.

  • #7
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    yeah, i remember the whole color thing and i always get confused with the whole background image, i still dont know why sometimes it will work and sometimes it wont like

    Code:
    background-image:url(path.gif)no-repeat top left;
    see i dont know if that works or not because sometimes it will and sometimes it wont!

  • #8
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Thats not correct. In order to use shorthand you need to use background:
    Code:
    background:url(path.gif) no-repeat top left;
    Also you need a space between each value or IE won't play. Good resource here on shorthand properties.
    http://www.htmldog.com/guides/cssint...te/multivalue/
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • Users who have thanked _Aerospace_Eng_ for this post:

    jcdevelopment (02-28-2008)

  • #9
    Senior Coder jcdevelopment's Avatar
    Join Date
    Oct 2007
    Location
    Cowboy Nation
    Posts
    2,182
    Thanks
    174
    Thanked 257 Times in 257 Posts
    ahhh, ok now i get it, thank you sir!!

  • #10
    New Coder
    Join Date
    Feb 2008
    Posts
    32
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thank you! I did everything you said to do, and now the positioning is perfect. But, the navigation/sidebar won't slide out to the left...instead it pulls out to the right with the sidebartab staying in place.

    This always seems to happen, lol
    "Loo loo loo, I've got some apples, loo loo loo, you've got some, too!" - Butters

  • #11
    Regular Coder ajhauser's Avatar
    Join Date
    Nov 2007
    Location
    Earlville. It's where Earls come from.
    Posts
    226
    Thanks
    74
    Thanked 1 Time in 1 Post
    Hey I just wanted to clarify something real quick:

    Code:
    * {
    margin:0px;
    padding:0px;
    }
    When added to a stylesheet, does this make the default margin/padding for every CSS element 0 AND HTML elements (<p>, <ul>, <form>) as well?

    Thanks much.

  • #12
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    Quote Originally Posted by ajhauser View Post
    Hey I just wanted to clarify something real quick:

    Code:
    * {
    margin:0px;
    padding:0px;
    }
    When added to a stylesheet, does this make the default margin/padding for every CSS element 0 AND HTML elements (<p>, <ul>, <form>) as well?

    Thanks much.
    Huh? What do you think the CSS styles? It styles HTML elements.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #13
    New Coder
    Join Date
    Feb 2008
    Posts
    32
    Thanks
    3
    Thanked 0 Times in 0 Posts
    nobody knows why it won't slide?

    sorry, just feel like i'm being over-looked.
    "Loo loo loo, I've got some apples, loo loo loo, you've got some, too!" - Butters

  • #14
    Regular Coder ajhauser's Avatar
    Join Date
    Nov 2007
    Location
    Earlville. It's where Earls come from.
    Posts
    226
    Thanks
    74
    Thanked 1 Time in 1 Post
    Huh? What do you think the CSS styles? It styles HTML elements.
    I'm asking for the specifics - if I create a class called ".border" to apply to something like an image, does the

    Code:
    * {
    margin:0px;
    padding:0px;
    }
    Style BOTH the class ".border" and the image? Visually the result is obviously the same regardless, I'm trying to understand what is specifically going on though - what the "*" applies to.

  • #15
    Regular Coder ajhauser's Avatar
    Join Date
    Nov 2007
    Location
    Earlville. It's where Earls come from.
    Posts
    226
    Thanks
    74
    Thanked 1 Time in 1 Post
    And sorry ramboangel11, I didn't mean to ignore you I just need to find out about this.



  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •