SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Enthusiast asbali's Avatar
    Join Date
    May 2006
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question Why does IE6&7 displays ul li elements differenly than FF

    For example please see Nahid Fashions

    The Our product categories box at the top right shows all the li emelments in FF. But in IE7 they don't all fit in the box. IE6 displays them all but the line spacing is not the same as FF.

    I've tried to play with the line spacing, but so far I haven't been able to get the desired affect in IE without breaking FF.

    Is this one of those bugs. I've read the CSS FAQ but nothign seems to apply to this problem.

    Thanks for any help

  2. #2
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Seems to me like you've got too many floats in there. You're floating the <li> then you've got a div inside that which is floated and then you've floated the image as well when all you need to do is float the list items and make the image a bg-image of the anchor instead of putting it in the HTML.

  3. #3
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    ive noticed that as well on all my css sites. I always getting different ul padding.

    for example. http://www.precision-pc.com.au/staging/ down the bottom where it says special deals. the paddings are different.

    i use * { padding: 0; margin: 0 }, which i thought was to reset everything. maybe i'm missing something.

    Sorry that this post doesn't help you.

  4. #4
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by sears View Post
    for example. http://www.precision-pc.com.au/staging/ down the bottom where it says special deals. the paddings are different.
    i use * { padding: 0; margin: 0 }, which i thought was to reset everything. maybe i'm missing something.
    It's because you've got text-align: center on #content.

  5. #5
    SitePoint Member
    Join Date
    Aug 2007
    Posts
    14
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i was just testing something. back to normal now. as u can see it doesn't display the same in both browsers. not sure why.

  6. #6
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Because the list is next to floated content. You need to give it margin-left wider than the floated content.

  7. #7
    SitePoint Enthusiast asbali's Avatar
    Join Date
    May 2006
    Posts
    40
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Smile

    Thanks Tyssen for your help. The line spacing are good now.
    However the list bullets do't appear. Possibly another float problem?

  8. #8
    SitePoint Wizard bronze trophy Tyssen's Avatar
    Join Date
    Oct 2005
    Location
    Brisbane, QLD
    Posts
    4,067
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Because the list items are display: inline. Better to use float: left instead.


Bookmarks

Posting Permissions

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