|
|
Posted by Ben C on 01/08/08 22:38
On 2008-01-08, Fister <vil_ikke@have_spam.dk> wrote:
> Hello Ben,
>
>> You could use span instead of div, and set
>>
>> .container, .heading, .text { display: block }
>
> That crossed my mind too but I thought there might be a better solution.
The fact that <a> is "inline" so can't contain headings and divs and
things is perhaps a bit of an anachronism these days. It's not clear to
me who that rule is helping.
There's nothing "logically" or "semantically" inline about an anchor as
far as I can see. It's just a hyperlink and why shouldn't you hyperlink
a whole lot of stuff at once?
>> The caveat is that this won't look good on non-CSS browsers.
>
> Non-CSS browsers? That would be very old browsers?
Pretty much. Or browsers belonging to people who have turned CSS off.
>> Or you could use several <a> elements-- one inside each of the block
>> elements.
>>
>> <div class="heading"><a href="page.html">Heading</a></div>
>>
>> etc.
>>
>> How are you doing the colour change? If you use a:hover { color: green
>> } then it should all go green when you hover on any part of it, since
>> when you hover on something you also hover on its descendents.
>
> I was using a:hover but if I have several anchors I'll have to use JavaScript
> to have them all change color when the mouse is above any one of them(?).
What I meant to say was you can set the :hover colour change on
#container, not on a. Then the whole lot will light up when you hover on
any part of it.
I also meant to say when you hover on something you also hover on its
_ancestors_, not on its descendents.
Something like this:
<div id="container">
<h1><a href="foo">Heading</a></h1>
<div><a href="foo">Text</a></div>
</div>
#container:hover { background-color: yellow; color: magenta }
The problem here though is that bits of the whole ensemble that you
can't actually click on will still light up under hover.
And I think someone said :hover doesn't work in IE anyway.
Navigation:
[Reply to this message]
|