CSS background image

how can I add a link?

[malasorte]

Hello all,

Please, I need help with this:

I inserted in my page a background image for a banner, the CSS code looks like this:

#banner {
height : 30px;
width : 730px;
background-image : url("http://www.example.com/banner.png");
}

In my HTML code I insert the background image in my page and add some text over it:

<div id="banner">
<i>This is some text.</i>
</div>

How can I make this image clickable (When I click on it, the image takes me to a certain page)?

Thanks in advance for any help!

Edit: The doctype I use is XHTML 1.0

[Robin_reala]

You can’t add links with CSS but because you've got some text you can use a CSS trick to work around it. If you change your markup to:

<div id="banner">
<a href="#">This is some text.</a>
</div>

then you can make your <a> fill the banner height and width:

#banner a {
font-style: italic;
display: block;
height: 100%;
}

The display:block makes it act in the same way that a <div> does - i.e. fill the horizontal space. Adding the height:100% makes it fill the vertical space as well.

[malasorte]

Worked perfectly - Thanks Robin_reala!