I have a 100% wide horizontal list inside a div [that is also 100% wide] that Im using as a global nav.

But in FF there is always a horizontal scroll bar at the bottom [even when there isnt any scrolling room].

If I remove the list the scroll bar goes away. Does anyone know how I can fix it? Here is my code:

#nav {
padding:0;
margin:1px 0 0 0;
width:100%;
list-style-type:none;
background-color:#2786CB;
float:left;}

#nav li {
display:inline;}

#nav a {
width:130px;
margin-right:1px;
padding:5px 0 5px 5px;
background:url(../image/liNav.jpg) no-repeat 0 0;
display:block;
text-decoration:none;
color:#FFF;
float:left;
border-right:#FFF solid 1px;}

It's probably the few px of margins you have that throws things off. You might have to set the width or the list back a couple of % points maybe 98% or 97%.

If that doesn't work try setting the div width a little smaller.