|
|
Posted by Syl on 08/16/07 20:03
On Aug 16, 3:37 pm, John Hosking <J...@DELETE.Hosking.name.INVALID>
wrote:
> Syl wrote:
> > 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).
>
>
> 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%.
Hello John!
THANKS for taking the time to provide such a concise answer.
I'll be picking apart tonight in the expectations that it will be
resolved from yuor post!
I think the key lives here :
> 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.
Well noted about removing relevant / irrelevant info when posting. So
my apologies.
I was amazing it validated too! lol.
I know it's a mess - I have been spending time bringing several CSS
methods into the Nifty Corners code in order to integrate drop down
menus with the Nifty layout.
Hence the absolute mess of js and css
Yes - IE is displaying the way I want it (the client wants it) to.
Thanks again!
Navigation:
[Reply to this message]
|