margin-left:0px; problem i think: Please help!

[gokeeffe]

I am have difficulty get my nav bar lined up exactly in IE and FF in the forum section of my website:

www.askaboutvalidation.com/forum

Here is my nav code

#navlist li {
display:inline;
padding:0 .9em;
border-right:1px solid #FFFF00;

}
#navlist li.last {
border:none;

}

#navlist {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:.9em;
font-weight:normal;
text-align:left;
margin-left:0px;
padding-top:6px;
padding-bottom:8px;
}

#navlist a {
color:#FFF;
text-decoration:none;

}
#navlist a:hover {
color:#FFF;
text-decoration:underline;

}


I think the problem lies in the #navlist {} section where I have margin-left:0px;

For my link to align far left in IE i need to include this as if I don't it goes more to the right but in FF
it doesn't move and is not in the same position as that in IE.

Is there any trick to make it align equally in both.

Here is the entire code which is incorporated into the header section of vbulletin

<meta http-equiv="Content-Type" content="text/html; charset=$stylevar[charset]" />
<meta name="generator" content="vBulletin $vboptions[templateversion]" />
<if condition="$show['threadinfo']">
<meta name="keywords" content="$threadinfo[title], $vboptions[keywords]" />
<meta name="description" content="<if condition="$pagenumber>1"><phrase 1="$pagenumber">$vbphrase[page_x]</phrase>-</if>$threadinfo[title] $foruminfo[title_clean]"

/>
<else />
<if condition="$show['foruminfo']">
<meta name="keywords" content="$foruminfo[title_clean], $vboptions[keywords]" />
<meta name="description" content="<if condition="$pagenumber>1"><phrase 1="$pagenumber">$vbphrase[page_x]</phrase>-</if>$foruminfo[description_clean]" />
<else />
<meta name="keywords" content="$vboptions[keywords]" />
<meta name="description" content="$vboptions[description]" />
</if>
</if>

<!-- CSS Stylesheet -->
$style[css]
<if condition="is_browser('opera') AND !is_browser('opera', '8.0.1')">
<style type="text/css">
ul, ol { padding-left:20px; }
</style>
</if>
<!-- / CSS Stylesheet -->

<script type="text/javascript">
<!--
var SESSIONURL = "$session[sessionurl_js]";
var IMGDIR_MISC = "$stylevar[imgdir_misc]";
var vb_disable_ajax = parseInt("$vboptions[disable_ajax]", 10);
// -->
</script>

<script type="text/javascript" src="clientscript/vbulletin_global.js?v=$vboptions[simpleversion]"></script>
<if condition="$show['popups']"><script type="text/javascript" src="clientscript/vbulletin_menu.js?v=$vboptions[simpleversion]"></script></if>
<if condition="$vboptions['externalrss']">
<link rel="alternate" type="application/rss+xml" title="$vboptions[bbtitle] RSS Feed" href="external.php?type=RSS2" />
<if condition="$show['foruminfo'] OR $show['threadinfo']">
<link rel="alternate" type="application/rss+xml" title="$vboptions[bbtitle] - $foruminfo[title_clean] - RSS Feed"

href="external.php?type=RSS2&amp;forumids=$foruminfo[forumid]"

/>
</if>
</if>



<style type="text/css">

/*Links for forum links under header */

A:link.color11 { color:#0033FF;font: 12px 'arial', sans-serif; font-weight:normal;text-decoration:underline;}
A:visited.color11 {color:#0033FF;font: 12px 'arial', sans-serif; font-weight:normal;text-decoration:underline;}
A:hover.color11 {color:#FF6600;font: 12px 'arial', sans-serif; font-weight:normal;text-decoration:underline;}
A:active.color11 {color:#0033FF;font: 12px 'arial', sans-serif; font-weight:normal;text-decoration:underline;}


#container
{
width:100&#37;;
background:#FFF;/*this colour will be left column colour */
margin:auto;/* centre for compliant browsers*/
}

#header
{
height:100px;
margin-left:23px;
margin-right:23px;
margin-bottom:0px;
background:#fff;
}


#header2
{

margin-left:23px;
margin-right:23px;
margin-top:-15px;

margin-bottom:-15px;
background:#006600;
}



html {
SCROLLBAR-FACE-COLOR: #fff;
SCROLLBAR-HIGHLIGHT-COLOR: #FFF;
SCROLLBAR-SHADOW-COLOR: black;
SCROLLBAR-ARROW-COLOR: black;
SCROLLBAR-TRACK-COLOR: #FFF;
SCROLLBAR-DARKSHADOW-COLOR: #666;
}


#navlist li {
display:inline;
padding:0 .9em;
border-right:1px solid #FFFF00;

}
#navlist li.last {
border:none;

}
#navlist {
font-family:Geneva, Arial, Helvetica, sans-serif;
font-size:.9em;
font-weight:normal;
text-align:left;
margin-left:0px;
padding-top:6px;
padding-bottom:8px;

}
#navlist a {
color:#FFF;
text-decoration:none;

}
#navlist a:hover {
color:#FFF;
text-decoration:underline;

}



</style>




<!-- Start of container also know as wrapper -->
<div id="container">

<div id="header">
<div style="float:left;margin-top:18px;"><a href="http://www.askaboutvalidation.com"><img border style="none" alt="www.askaboutvalidation.com" src=

"images2/askaboutvalidationlogo.png"></a>
</div>
<div style="float:right;margin-top:80px;margin-right:5px;">
<a class="color11" title="" href="http://www.askaboutvalidation.com/forum/">Forum</a>
&nbsp;&nbsp
<a class="color11" title="" href="http://www.askaboutvalidation.com/forum/register.php">Register</a>
&nbsp;&nbsp
<a class="color11" title="" href="http://www.askaboutvalidation.com/site_map.php">Site Map</a>
&nbsp;&nbsp
<a class="color11" title="" href="http://www.askaboutvalidation.com/contact.php">Contact</a>

</div>

</div>


<div id="header2">


<ul id="navlist">
<li><a href="http://www.askaboutvalidation.com">Home</a></li>
<li><a href="http://www.askaboutvalidation.com/forum">Forum</a></li>
<li><a href="http://www.askaboutvalidation.com/featured_articles.php">Articles</a></li>
<li><a href="http://www.askaboutvalidation.com/white_papers.php">White Papers</a></li>
<li><a href="http://www.askaboutvalidation.com/forum/register.php">Register</a></li>
<li class="last"><a href="http://www.askaboutvalidation.com/contact.php">Contact Us</a></li>
</ul>


</div>
</div>



Any help would be greatly appreciated.

[Paul O'B]

Hi,

Haven't look at you page or code yet bus sounds as though you haven't reset the default padding on the ul to zero. Ie uses a default left margin for the bullet space and firefox use a default left padding. You need to address both margin and padding on all the elements you use.

ul{margin:0;padding:0}

If that's not the problem then i'll take another look

PS Please use code tags when pasting code

[gokeeffe]

Hi Chris,

That was the problem you were spot on.

I can't thank you enough.

Thanks again

Best Regards

Graham

[Paul O'B]

Who's Chris

[gokeeffe]

Sorry Paul, was working with a fella called Chris today!

thanks again