I have this H1. I hide the text and replace with my site's header. Unfortunately, I get a validation error.
Here's my XHTML:
<body>
<div id="page">
<div class="pad">
<div id="header">
<div><a href=http://www.webdeveloper.com/forum/archive/index.php/"default.cfm" title="Return to our welcome page"><h1><span>Title of site in here</span></h1></a></div>
</div>
<div id="topMenu">
*snip*
Here's my CSS
*snip*
#header h1 span{display: none;}
#header h1{background-image: url(images/header.gif); background-repeat: no-repeat; width: 760px; height: 98px;}
*snip*
And finally here's my error:
Error: element h1 not allowed here; possible cause is an inline element containing a block-level element
Any ways around this?First of all if you have a div just to give the h1 an id then just give the h1 the id:<h1 id="header"><span>Title of site in here</span></h1>Heh, the only reason I have that div is because it seemed to not validate. Thus, I thought by adding that there, the error would go away! LOL!The error is most likely caused by the anchor tag (inline element) around the h1 (block level element).
Put the a tag inside the h1 where it belongs.
That's what I initially did. Since I hide the content in the span so that I can display the graphic, the link goes nowhere. That's why I put it outside the H1 so that the graphic became clickable.
BTW, thanks for the insight!
Here's my XHTML:
<body>
<div id="page">
<div class="pad">
<div id="header">
<div><a href=http://www.webdeveloper.com/forum/archive/index.php/"default.cfm" title="Return to our welcome page"><h1><span>Title of site in here</span></h1></a></div>
</div>
<div id="topMenu">
*snip*
Here's my CSS
*snip*
#header h1 span{display: none;}
#header h1{background-image: url(images/header.gif); background-repeat: no-repeat; width: 760px; height: 98px;}
*snip*
And finally here's my error:
Error: element h1 not allowed here; possible cause is an inline element containing a block-level element
Any ways around this?First of all if you have a div just to give the h1 an id then just give the h1 the id:<h1 id="header"><span>Title of site in here</span></h1>Heh, the only reason I have that div is because it seemed to not validate. Thus, I thought by adding that there, the error would go away! LOL!The error is most likely caused by the anchor tag (inline element) around the h1 (block level element).
Put the a tag inside the h1 where it belongs.
That's what I initially did. Since I hide the content in the span so that I can display the graphic, the link goes nowhere. That's why I put it outside the H1 so that the graphic became clickable.BTW, thanks for the insight!