Hi hi.

As above i'm having problems with internet explorer and headers defines in css. The script is xhtml, and this is only effecting some of the header styles.

#header h7 {
float: left;
padding: 50px 0 0 10px;
font-size: 43px;
text-transform: none;
color: #FF0066;
}
#header h8 {
float: left;
padding: 50px 0 0 0px;
font-size: 43px;
color:	#0066FF;
}

 

Any ideas? If this were HTML5 i'd understand ..

That CSS looks fine. It's probably something to do with your HTML or layout.

 

Can you post a link to the site so we can see the code (...and how you've managed to get down to H8 tags just in the header!)?

That CSS looks fine. It's probably something to do with your HTML or layout.

 

Can you post a link to the site so we can see the code (...and how you've managed to get down to H8 tags just in the header!)?

 

Lol... it's actually where i was changing styles over.. i think there's a header22 somewhere ... www.**********.co.uk.. thank you for your help!

Edited March 8, 201214 yr by affmark

Basically, H7 and H8 tags don't exist. The W3 spec for heading only goes up to H6. Most browsers are smart enough to work out what it should be and render the tags, but IE is sticking to the rules so doesn't recognise them.

 

You might be able to change your DOCTYPE from Strict to either Transitional or Loose to get them to display in IE, but it would be better to replace the tags completely, eg:

 

<h1>Jessey<span class="blue">Lees</span><span class="white">.co.uk</span></h1>

Basically, H7 and H8 tags don't exist. The W3 spec for heading only goes up to H6. Most browsers are smart enough to work out what it should be and render the tags, but IE is sticking to the rules so doesn't recognise them.

 

You might be able to change your DOCTYPE from Strict to either Transitional or Loose to get them to display in IE, but it would be better to replace the tags completely, eg:

 

<h1>Jessey<span class="blue">Lees</span><span class="white">.co.uk</span></h1>

 

 

Great, thanks. I tried changing it over to transitional and that didn't make much difference. I've just moved some of the css to fit h1-h6. Thank you for your help! (Y)

If you want more than six h elements, choose one between h1 and h6 that is nearly what you want, with the correct ranking, then add a class:-

CSS

.h7 { color: red; }
.h8 { background: blue; }

HTML markup:-

<h3 class="h7">..........</h3>
<h4 class="h8">..........</h4>