#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2005
    Posts
    43
    Rep Power
    14

    Stupid IE! Page goes out of control; Works fine in Safari and Firefox [HELP!]


    I just finished an element for a redesign of my website. I open it in Firefox, working. I open it in Safari (for Windows), fine. I open it in IE, I almost cry.

    My entire page is screwed up! I can't tell if it's the floats, the margins, the lists (I think it's the lists).

    Anyways, does anyone know whats wrong so I could fix it?

    http://www.politinks.com/topbar

    Any help would be appreciated. Thanks!
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    No, the problem is caused by the text-align:center on #topbar. Give it to ".topbar_notice" directly instead.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  4. #3
  5. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2005
    Posts
    43
    Rep Power
    14
    Thanks, but I didn't use text-align:center on the topbar. I put it into the body directly. It's pretty much gonna be there on all pages of the site, so is there another solution? Also, with text-align removed, the list/menu is still messed up (although the page is still more properly formatted) .
    Any help?

    I hope I don't have to resort to a non-list menu.
  6. #4
  7. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Hmm... Ah. It seems I forgot that IE's DOM Explorer shows inherited styles.

    Give #topbar text-align:left and ".topbar_notice" text-align: center.

    Comments on this post

    • gamebittk agrees : Thanks Kravvitz!
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  8. #5
  9. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2005
    Posts
    43
    Rep Power
    14
    That'll fix the text-align problem. Thanks Kravvitz.

    But the menu is still messed up:
  10. #6
  11. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    You're welcome

    I was looking at it in FF2 and IE7. To fix that IE6 issue, give the the "#topbar li a" float:left.

    FYI, IE8 beta 1 is out now. (I suggest that other people wait for beta 2 before trying it out though. Beta 1 is rather buggy.)

    Comments on this post

    • gamebittk agrees : It works! Thanks Kravvitz!
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  12. #7
  13. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2005
    Posts
    43
    Rep Power
    14
    It works! Thanks a lot Kravvitz!
    Weird how IE didn't recognize the floats I already had on '#topbar li'. Good thing IE8 will follow standards.
    Now I can focus on rolling out the rest of the site.

IMN logo majestic logo threadwatch logo seochat tools logo