You are here: Re: Header behaviour between browsers « HTML « IT news, forums, messages
Re: Header behaviour between browsers

Posted by John Hosking on 08/16/07 19:37

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).

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.

--
John
Pondering the value of the UIP: http://blinkynet.net/comp/uip5.html

 

Navigation:

[Reply to this message]


Удаленная работа для программистов  •  Как заработать на Google AdSense  •  England, UK  •  статьи на английском  •  PHP MySQL CMS Apache Oscommerce  •  Online Business Knowledge Base  •  DVD MP3 AVI MP4 players codecs conversion help
Home  •  Search  •  Site Map  •  Set as Homepage  •  Add to Favourites

Copyright © 2005-2006 Powered by Custom PHP Programming

Сайт изготовлен в Студии Валентина Петручека
изготовление и поддержка веб-сайтов, разработка программного обеспечения, поисковая оптимизация