Syl said:
Hello group - I'm getting different behaviour between IE and Netscape.
You mean groups. But followups set to c.i.w.a.s.
IE is displaying correctly.
You mean, IE is displaying the way you want?
I have two divs - header and menu.
If you take a look at :
http://checkeredshirt.com/content_too.html
Actually, you have a lot of divs. That's a pretty big page for a
simplified test case. Maybe for future debugging you could remove the
irrelevant code before posting.
Similarly, that's an awful lot of CSS. And if you do need it all (which
I really doubt), then I suggest (and request) that you make it external
rather than embedded as it is here.
Cool, though, that both your markup and CSS are validated!
The menu div is inside the header div, but Netscape is not recognizing
it this way.
Do you mean you want the green nav tabs to be to the right of the
"Centre" text? Not gonna happen (in a conforming browser, that is).
div#header h1 { width:800px; margin:0 auto; text-align:left; }
div#menu { width:800px; margin:0 auto;text-align:left; }
div#header h1 { padding: 5px 0 10px; color: #FFF}
The first ruleset asks for h1 to be 800px wide (instead of, e.g.,
leaving it at its natural width, or specifying it in em units). (The
third ruleset doesn't change that but it's sitting separately and I
can't tell why.) The second ruleset wants your #menu to be another 800px
wide, but you don't have a minimum of 1600 px for these two things to be
side by side, even if they wanted to be.
Or maybe you want the green tabs to appear up in front of the darker
gray bg. The menu div is inside the header div, as you say, but the
green tabs (ul#menudrop) have been floated, and so are out of the flow
(i.e., have no height as far as #menu is concerned.
One approach is to give #menu a height:3.2em; (more or less, suck it and
see). But probably someone like Ben C will come along with better
advice; mine is just a workaround. (You'll have trouble when somebody
resizes your text, due to the mix of px and em, but you've got that
problem already anyway.)
Misc. now, entirely unrelated to your problem here:
BTW 1: I don't know what's centered about your "Centre" texts; I guess
they refer to a facility, eh?
BTW 2: You get a horizontal scrollbar because #header has width:100% and
a 1px border. 100% + 2px = scrollbar.
BTW 3: Please don't do this: body {font: 85%/1.3 Verdana }. Use another
font face and make it 100%.
HTH.
