Hi, I am driving myself crazy with a simple navigation menu - it has
to be pixel perfect on Safari and FF and I can't make it happens. I
add few pixels to the margin or padding top, it works on one of the
browse, but not both.
The tabs are wrapped in the header, floated left column .
The markup looks like this :
<div id="header">
<div id="leftcolumn><img src="logo.jpg">
<ul><li>some stuff goes here</li></ul>
</div>
<div id="rightcolumn">
<form>search form</form>
<ul><li>list with inline display</li></ul>
<div id="tabs><ul>
<li>this is where it's driving me crazy</li>
<li>I am pulling my hair off</li>
<li>HELP PLEAS</li>
</ul>
</div>
<div><!-- #end header-->
the url
http://lotusseedsdesign.com/temp/home.html
CSS file, the #tabs starts from line #234.
browsercam screen shot
http://www.browsercam.com/public.aspx?proj_id=271980
Right now Safari displays pixel perfect, Opera is 1px short, the main
browser I am concern is Firefox which creates at least 3 pixels
different then Safari. As for IE, I can use conditional comments. I
need the tabs touches the bottom of the header background image and
they appear the same in both Safari and Firefox.
Thanks in advance!
tee
******************************************************
The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm
for some hints on posting to the list & getting help
******************************************************
