[SOLVED] How to make a div a link

[R8515198]

Hi all,
I have a div with a background image, and am trying to make the div a link. A class sould be easier as then I could apply it to rest of the buttons.

Any help will be greatly appreciated

Dan

Code: Select all

#CMS{
 background-image: url(assets/buttons/right/blue_CMSbutton.gif);
 background-repeat: no-repeat;
 background-position: center center;
 height: 40px;
 width: 150px;
 margin-left: 15px;
}

HTML: Select all

<div id="CMS"></div>

[Marc]

You would have to do something like:

HTML: Select all

<a href=""><div id="CMS"></div></a>

although i would opt for a <span> rather than a <div>.

[R8515198]

Nice and simple

Cheers

Marc

[Marc]

Your welcome - that's what I'm here for!

[MikeHopley]

As Marc said, you should use a <span>, not a <div>. If you use a <div>, you will likely make invalid code.

As a general rule, don't put block-level elements (such as <div>) inside inline elements (such as <a>). See this W3C explanation:

Content model

Generally, block-level elements may contain inline elements and other block-level elements. Generally, inline elements may contain only data and other inline elements. Inherent in this structural distinction is the idea that block elements create "larger" structures than inline elements.

You can have the appearance of a <div> by using the CSS:

Code: Select all

span.block { display: block; }

This trick is commonly applied to <a> elements in navbars.