I'm designing a page:
http://www.imsuden.f2s.com/fall/news/
In IE6 the 'News Archive' <h2> headline doesn't have a line break (or a margin?) above it. Is there any reason for this, and can I remedy the problem?
Thanks.
[fixed] IE6 omits a line break; Firefox and Opera fine
I have had suspicions that IE does not properly collapse margins, and I think that's the case here. Two things should keep the h2 in #archive from having its margin collapsed. First, #archive is float, and floats should not collapse margins. Second, there is top padding which should stop collapse. But, IE is still doing it. Over in #news, the h2 margin should collapse except for the padding and IE does that right.
My untested suggestion is to make the h2 {margin-top: 0;} in both #archive and #news, and use top padding in those divs to adjust position of the h2.
Now, you have this in your stylesheet;
#archive h2 h3 { font-size: 1em; } #news h2 h3 { font-size: 1em; }where I think you mean, with my suggested change;
#archive h2, #archive h3 { margin-top: 0; font-size: 1em; } #news h2, #news h3 { margin-top: 0; font-size: 1em; }Check your h3, you may not want 0 margin on it.
One other thing you might try first, make #archive {position: relative;}. That will cure a number of IE float issues. Test well, it can also cause a number of IE float issues. Hey! It's IE, what else would you expect?
Did I say these were all untested? Good.
cheers,
gary
[fixed] IE6 omits a line break; Firefox and Opera fine
Cheers Gary, setting the h2 margin-top in both divs to 0 worked a treat
btw, was my original code:
#news h2 h3
not correct?
Ta.
[fixed] IE6 omits a line break; Firefox and Opera fine
Cheers Gary, setting the h2 margin-top in both divs to 0 worked a treat
Good, thought it might.
btw, was my original code:
#news h2 h3
not correct?
Assuming you want the h2s and h3s in the #news group to be {font-size: 1em;}[1], no. What you said is make any h3 that is nested in an h2 that is nested in #news {font-size: 1em;}. It will have no effect on h2. In addition, it's an illegal construct, since a heading may contain only inline elements.
cheers,
gary
[1] To treat them separately, you need a comma delimited list.