Yet Another Firefox / IE related problem...

Just a small problem;

http://www.derren-brown.net

See, in IE the 'Navigation' is inline with the top of the sidebar and content like it should be and in FireFox it's slightly down abit...

Anyone tell me the problem causing this?

 

avoid using <br> tags for spaces:

<div id="header"><a href="http://www.drivingmadeeasy.co.uk"></a><br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
</div>

In your css code use the height parameter instead:

eg.. > #header {height:100px;}

Cheers!

 

Not tested.

IE is incorrectly collapsing the margins, h1's into its container and h5 into its. Firefox is not. Simple fix, since both font sizes are the same, set {margin-top: 1em;} on both.

And do delete all those <br />s.

cheers,

gary

 

Or padding... with CSS there's never a good reason to do stuff like:

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

Spacing with BR's or with &nbsp; is no longer needed, and is just a waste of code... same goes for the all to common spacer.gif

 

Yeh, I do use padding. I use an external CSS file, the padding and margin set on both the sidebar and content are are the same, that's why it's puzzling me...

 

To repeat myself, as I have nothing better to do, it's the h1 and h5's margins.

gary

 

Ah yeh, cheers.