CSS menu look in Firefox versus I.E.

Discussion in 'CSS' started by steveeyes, Dec 27, 2006.

0
  1. #1
    My CSS knowledge has failed me again. I created a simple horizontal menu at the top of my html pages using CSS. It works, it is how it looks in firefox that is bugging me.

    Right now I have it position absolute left 10px. That is how I would like it to look, 10px from the left. Looks fine in I.E., but in firefox it looks like it is more like 15 or 20px.

    I'm hoping someone here is a browser expert and can tell me how I can make it in firefox look like it does in I.E. (10px left). I tried playing with margin and padding, but had no luck.


    Below is the CSS coding I used. Here is a link to my site:

    http://www.filipinaeyes.com

    Thanks in advance for any help.

    Steve


    /* TOP MENU STYLE */

    #navcontainer {position:absolute;
    left:10px; top:8px; width: 780px;}

    #navlist{margin: 0;}

    #navlist ul, #navlist li
    {
    margin: 0;
    padding: 0;
    display: inline;
    list-style-type: none;
    }

    #navlist a:link, #navlist a:visited
    {
    float: left;
    line-height: 14px;
    font-weight: bold;
    margin: 0 5px 4px 5px;
    text-decoration: none;
    color: #999;
    }

    #navlist a:link#current, #navlist a:visited#current, #navlist a:hover
    {
    border-bottom: 4px solid #AD3131;
    padding-bottom: 2px;
    background: transparent;
    color: #000;
    }

    #navlist a:hover { color: #000; }

    /* END TOP MENU STYLE */
     
    steveeyes, Dec 27, 2006 IP