Forum Moderators: not2easy

Message Too Old, No Replies

IE 5 (.5) breaks header

Pages OK in Mozilla, Netscape IE6

         

morris minor

1:35 pm on Mar 29, 2004 (gmt 0)

10+ Year Member



Any help much approeciated on this:

The header to my page consists of three rows, all styled by CSS.

The top line "superheader" doesn't display at all in IE5; the white text in "midheader" is black in IE 5; the red background to "subheader" is white (not red) in IE 5.

[Relevant code below]

I must be missing something pretty basic here guys - help!

[Both CSS and XHTML validate OK]

<%@LANGUAGE="VBSCRIPT" CODEPAGE="1252"%>
<% Option Explicit %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

. . . . .

<div id="header">

<div class="superHeader">

<div class="left">
</div>

<div class="right">
Some text here . . .
</div>

</div>

<div class="midHeader">
<h1 class="headerTitle">Title of Site</h1>
</div>

<div class="subHeader">
<a href="index.asp">Home</a> more links here
</div>
</div>

. . . . . rest of page

CSS:

.superHeader {
color: white;
background-color: rgb(175,0,0);
height: 2em;
}

.superHeader a {
color: rgb(0,91,46);
background-color: transparent;
text-decoration: none;
font-size: 91%;
margin: 0;
padding: 0 0.5ex 0 0.25ex;
}

.superHeader a:hover {
text-decoration: underline;
}

.superHeader .left {
position: absolute;
left: 1.5mm;
top: 0.75ex;
}

.superHeader .right {
position: absolute;
right: 1.5mm;
top: 0.75ex;
}

.midHeader {
color: white;
background-color: rgb(0,91,46);
}

.headerTitle {
font-size: 337%;
font-weight: normal;
margin: 0 0 0 4mm;
padding: 0.25ex 0;
}

.subHeader {
color: white;
background-color: rgb(175,0,0);
margin: 0;
padding: 1ex 1ex 1ex 1.5mm;
}

.subHeader a {
color: white;
background-color: transparent;
text-decoration: none;
font-weight: bold;
margin: 0;
padding: 0 0.75ex 0 0.5ex;
}

.subHeader a:hover {
text-decoration: underline;
}

.superHeader .highlight, .subHeader .highlight {
color: rgb(253,160,91);
background-color: transparent;
}

morris minor

10:13 pm on Mar 29, 2004 (gmt 0)

10+ Year Member



Please ignore!

The problem's not quite as I stated ...

Will create another post....