SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    Non-Member rateit05's Avatar
    Join Date
    Dec 2005
    Location
    Somewhere in the UK
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Unhappy List Display Probs between IE and FireFox

    Well i am having some display issues between IE and Firefox. See it here:

    http://coding.pixellmedia.com/honestreviews/

    As you can see Firefox displays it how i want it to, however IE seems to be getting some extra padding or what not from some where. How can i fix this?

    regards

  2. #2
    SitePoint Wizard bronze trophy Centauri's Avatar
    Join Date
    May 2007
    Location
    Newcastle, Australia
    Posts
    3,718
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try adding to your css
    Code:
    #nav img {
    		display: block;
    }

  3. #3
    Non-Member rateit05's Avatar
    Join Date
    Dec 2005
    Location
    Somewhere in the UK
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    stilll dont work

    Quote Originally Posted by Centauri View Post
    Try adding to your css
    Code:
    #nav img {
    		display: block;
    }

  4. #4
    SitePoint Wizard bronze trophy Centauri's Avatar
    Join Date
    May 2007
    Location
    Newcastle, Australia
    Posts
    3,718
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Makes quite a difference for me - closes up the gaps.

  5. #5
    SitePoint Wizard silver trophybronze trophy Nadia P's Avatar
    Join Date
    Oct 2004
    Location
    NSW Australia
    Posts
    3,564
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    try adding a line-height to the #nav ul li

    Nadia

  6. #6
    Non-Member rateit05's Avatar
    Join Date
    Dec 2005
    Location
    Somewhere in the UK
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks, but this doesnt seem to work either

    Quote Originally Posted by Nadia P View Post
    try adding a line-height to the #nav ul li

    Nadia

  7. #7
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,276
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    What's all this rubbish:
    Code:
    <li><a href="#">Average Joe Income Package</a></li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>Beating Adwords Review</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>More coming soon...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    <img src="images/nav_spacer.gif" alt="" />
    <li>...</li>
    You can't put image tags there so no wonder it display strangely

    Nothing can go between a the closing list tag and an opening list tag. Everything must be within the list pair.

    Why are you using images anyway as you can simply apply that to the background.

    e.g.

    Code:
    #left_bar {
            width: 174px;
            background-color: #FFFFFF;
            float: left;
    }
    
    #nav ul {
        text-align: center;
        margin:0 0 0 10px;
        width:164px;
    }
    
    #nav ul li {
        list-style: none;
        font-size: 11px;
        color: #7a7961;
        padding: 6px;
        float:left;
        clear:left;
        width:152px;
        background:url(http://coding.pixellmedia.com/honestreviews/images/nav_spacer.gif) no-repeat bottom center;
    }
    Code:
            <div id="nav">
                <ul>
                    <li><a href="#">Average Joe Income Package</a></li>
                    <li>Beating Adwords Review</li>
                    <li>More coming soon...</li>
                    <li>...</li>
                    <li>...</li>
                    <li>...</li>
                    <li>...</li>
                    <li>...</li>
                    <li>...</li>
                    <li>...</li>
                    <li>...</li>
                </ul>
            </div>

  8. #8
    Non-Member rateit05's Avatar
    Join Date
    Dec 2005
    Location
    Somewhere in the UK
    Posts
    0
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thnaks for posting that Paul O'B

    But i jsut managed to sort it right this minute. I just removed the image tags, changed some css propeties and added a border bottom to the nav ul li.

    Prob solved people

    regards


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
  •