Please Help! (CSS Problem)

by 4 replies
5
Can someone help me with this CSS issue? I can't seem to find out what's wrong. Maybe I've been in front of the computer too long...

Internet Explorer looks different from Firefox

Code:
#navcontainer ul {
    padding-left: 0;
    margin-left: 0;
    background-color: #036;
    color: White;
    float: left;
    width: 100%;
    font-family: arial, helvetica, sans-serif;
}

#navcontainer ul li { display: inline; }

#navcontainer ul li a {
    padding: 0.2em 1em;
    background-color: #036;
    color: White;
    text-decoration: none;
    float: left;
    border-right: 1px solid #fff;
}

#navcontainer ul li a:hover {
    background-color: #369;
    color: #fff;
}
Here is the part of the source code where it's referenced:
Code:
<!--NAVIGATION ON TOP STARTS -->
<div id="navcontainer">
<ul>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>
</div>
<!--NAVIGATION ON TOP ENDS -->


<div id="header">
</div>
If the one above isn't good or can't be fixed, is there a better solution for a horizontal menu?
#website design #css #problem
  • Personally, I find it more stable to float each of the list items to the left instead of using the display inline method, ie. #navcontainer ul li { float:left; }

    It works well for me and I've found it easier to get cross browser compatibility with this approach.
  • Thanks for the input!

    Yeah, I ended up NOT using this one. I found a better solution and it's less messier than the above.
  • I still hate layers bacause of the IE box shit.
    I still prefer tables.
    • [1] reply

    • You sacrifice seo with tables. Its worth learning divs for sure.

      Pete
  • Banned
    [DELETED]
Join the discussion

Next Topics on Trending Feed

  • 5

    Please Help! (CSS Problem)

    Can someone help me with this CSS issue? I can't seem to find out what's wrong. Maybe I've been in front of the computer too long... Internet Explorer looks different from Firefox