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

    Join Date
    Apr 2011
    Posts
    15
    Rep Power
    0

    Dropdown menu part II. IE compatibility!


    Hi and thanks for the help so far Kravvitz. I checked my menu out on IE and got the following results (see screen captures below).

    You can probably see the element doesn't seem to go to the edge of the dropdown. Because of this the next ul level is appearing right beside the highlighted area (as it would normally), but since it isn't going to the end of the 'row' it is resulting in overlapping!

    Is there a way to make this work out in IE as well that you could recommend? 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
    You're welcome.

    Increase the width of "ul.dropdown ul" and "ul.dropdown ul a".

    Give "margin-right:0" to the "ul.dropdown ul li, ul.dropdown-vertical" rule in "shailan-dropdown.css".

    Also IE is inheriting "text-align:center" from a <div> with align=center, so give "text-align:left" to one of the "ul.dropdown" rules.

    The "align" attribute of <p>s, headings (e.g. <h1>), <img>s, and <div>s is deprecated (basically meaning that you shouldn't use it). You should use CSS to control alignment.
    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
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Apr 2011
    Posts
    15
    Rep Power
    0

    Thanks


    Wow that was a mouthful thank you! I feel like you just did one of those "can you find what is wrong with this picture" puzzles on my page!

    It is much appreciated.

    Drew

    EDIT: I didn't know where to find some of what you mentioned.

    Also IE is inheriting "text-align:center" from a <div> with align=center, so give "text-align:left" to one of the "ul.dropdown" rules.

    The "align" attribute of <p>s, headings (e.g. <h1>), <img>s, and <div>s is deprecated (basically meaning that you shouldn't use it). You should use CSS to control alignment.
    Where would this be? Still getting some weird behavior in IE7 where the longest link is invisible...

IMN logo majestic logo threadwatch logo seochat tools logo