Textpattern CMS support forum
You are not logged in. Register | Login | Help
- Topics: Active | Unanswered
Pages: 1
#1 2006-02-25 17:59:15
- -P-
- Member
- From: Finland
- Registered: 2005-09-10
- Posts: 211
Header as a link and valid?
This must be really n00b question but since I have never ever yet been able to solve it by my self, I trust on you.
I need to make banner as active link so clicking it takes you back to home.
<code>
<a href=”<txp:site_url />”><div id=“banner”></div></a>
</code>
That works but I does not validate… getting error
<code>The mentioned element is not allowed to appear in the context in which you’ve placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you’ve forgotten to close a previous element.
One possible cause for this message is that you have attempted to put a block-level element (such as “<p>” or “<table>”) inside an inline element (such as “<a>”, “<span>”, or “<font>”).</code>
If I take that one out, site validates so I assume there´s no some other open tag messing things up.
What really valid css obvious am I missing here?
Last edited by -P- (2006-02-25 17:59:47)
Offline
Re: Header as a link and valid?
Its not validating because <code>div</code> is block level and <code>a</code> is inline. Better to put the <code><a href=”“></code> inside the banner div and style it with CSS. is the banner only an img? I am assuming because you are using a div element that it contains more information/type? If that is the case, you could have your banner div, and inside, position the link element absolutely, set <code>display: block</code> and make its size the size of your banner. That should make your hole banner clickable. You might also want to put <code>text-indent: 1000em</code> and <code>overflow: hidden</code> on tyhe stlye of the link..
Last edited by Jeff_K (2006-02-25 18:07:05)
Offline
#3 2006-02-25 18:29:07
- -P-
- Member
- From: Finland
- Registered: 2005-09-10
- Posts: 211
Re: Header as a link and valid?
Thank you Jeff_K from your reply! Banner is only an image.
Okay, not quite yet there…
<code>#banner {
margin: 0px;
background: url(../styleimages/lefttop.gif) top no-repeat;
height: 232px;
width: 499px;
float:right;
}
#banner h1 {
margin: 0px;
height: 232px;
width: 499px;
float:right;
display: block;
text-indent: 1000em;
overflow: hidden;
}</code>
and I am able to put it like this:
<code><div id=“banner”><a href=”<txp:site_url />” ><h1>plaa plaa</h1></a></div></code>
…assuming that I understood correctly your advice but h1 is not allowed there either??? Aaaargh, I neet to go to css school.
Last edited by -P- (2006-02-25 18:30:22)
Offline
Re: Header as a link and valid?
“h1” is block level too if my memory serves so that also needs to wrap the link. In your CSS you may need to style “#banner h1 a”.
Stuart
In a Time of Universal Deceit
Telling the Truth is Revolutionary.
Offline
#5 2006-02-25 20:43:03
- -P-
- Member
- From: Finland
- Registered: 2005-09-10
- Posts: 211
Re: Header as a link and valid?
Yippeeeee!! Solved!
This particular thing has been giving me headache for quite a long time. Now I finally understood bit more about hierachy of valid.
with css and <code><div id=“banner”><h1><a href=”<txp:site_url />” >plaa plaa</a></h1></div></code>
Thank you!!
Last edited by -P- (2006-02-25 20:55:24)
Offline
Re: Header as a link and valid?
you could also probably drop the div and just go with <code><h1 id=“banner”></code>. Plop the background in <code>h1#banner</code> in your css and it should work. Saves some markup too.
Offline
Re: Header as a link and valid?
Yeah, no need for the div if you already have the h1 as a block element.
Shoving is the answer – pusher robot
Offline
Pages: 1