Re: Two display problems between IE and FF

VK wrote:
Alan Silver wrote:

I'm still left with the second problem though (see below) and would
really appreciate any help. I'm pretty sure this is not the peekaboo bug
as I tried the usual suggestions for that and none of them helped.

The problem appears in IE6 and IE7, but not in FF 1.0.7 or Opera 8.54

Any ideas? TIA

2) If you look at the page in IE, the header section does not have its
content displayed. In FF it shows up fine. I have discovered that the
problem is caused by having "clear:both" in the #footer. I have no idea
why the one affects the other, but it does. If I remove this line from
the CSS, then IE shows the header correctly, but (oddly) still has the
footer clearing both other bits. FF does not have the footer clearing,
and displays it in the little space between the links and the main
content. How can I have it so that the footer appears cleared below the
links and content, but does not cause the header content to disappear?

I have no idea why IE does that, I saw some mention of "disappearing"
content when clear is used too extensively. So me real CSS expert may
comment on that.

Disappearing content when a clear follows a float in IE = "Peekaboo bug"
See http://www.positioniseverything.net/explorer/peekaboo.html

But this doesn't look like the peekaboo bug.

Doing a little digging:

First, remove position:absolute from #header - this will allow the header to be visible. It appears at the bottom of the page, just above the footer.

Then move the header <div> up to the top of the page, just before <div id="pagecontent">

For #pagecontent, change margin: 70px 0 0 0; to margin: 0px;

Do the same for #toplevellinks

I did exactly those changes & it works fine for me. There IS a difference of 1 or 2 pixels between the old layout & new in Firefox - but that's easily fixed by tweaking the borders.
.

Relevant Pages

  • Re: Numeric character references in generated content
    ... Better would be to have two divs, one as header and one as footer. ... Include your h1 page title and navigation in the header; ... then a header div makes sense. ...
    (comp.infosystems.www.authoring.stylesheets)
  • header/footer Div locking on IE
    ... i am struggling with locking both the header and the footer on IE. my header ... my body and footer is a div. ... the footer and have the body with the scroller on it. ... time with scroller provided for the div body. ...
    (microsoft.public.dotnet.framework.aspnet)
  • RE: Datagrid with fixed height
    ... Keep a div in the page and keep the datagrid inside the div and specify the ... header and footer with fixed height and a blank space before ...
    (microsoft.public.dotnet.framework.aspnet)
  • 2 divs on same line
    ... i have a requirement for the following layout in my masterpage: ... div for header ... div for footer ...
    (microsoft.public.dotnet.framework.aspnet)
  • Re: unlink Footer/Header in VBA
    ... AutoText it will bring the section break with it. ... Header, a footer and Bibliography all in one. ... Bibliography" and another for "Footer for Bibliography". ...
    (microsoft.public.word.vba.general)
Loading