|
|
Posted by Sean on 01/08/08 21:16
On Tue, 08 Jan 2008 19:23:08 +0000, Fister wrote:
> Since anchors are inline elements and divs are block elements the
> validation doesn't permit me placing an anchor around a div like the
> following:
>
> <div id="containers">
> <a href="page.html">
> <div class="container">
> <img alt="image" src="image.jpg" />
> <div class="heading">Heading</div>
> <div class="text">Text</div>
> </div>
> </a>
> </div>
>
> I want for the heading and text to change color whenever the mouse is
> above the image, heading or text. I also want for the image, heading and
> text to be below eachother so that's why I'm using divs and not spans.
>
> Isn't this common code and how do I make it valid?
Make the header a link instead of its container. Changing color and text
can easily be done through css.
===example.html===
<div id="containers">
<div class="container">
<!-- I'm assuming you want both the image and heading linked -->
<a href="page.html" title="">
<img src="image.jpg" alt="" />
<h2>Heading</h2></a>
<p>Text</p>
</div>
</div>
===end===
===example.css===
..container h2:hover {
color: orange;
}
===end===
You can do the same with the text if you wish.
Navigation:
[Reply to this message]
|