How can I make the div tag link back to the home page?

Question

http://www.winteradagency.com/Arvin/advantages/advantages.htm

I need the logo in the top left corner to link back to the home page for this site. I can't figure out how to make a tag have an anchor tag in it.

thanks!

Answer 1

Add an element like this in the header div to put a transparent link on top of the logo:

<a href="/" id="logo">&nbsp;</a>

Add this to the style sheet:

#logo { position: absolute; left: 31px; top: 26px; width: 190px; height: 190px; }

Answer 2

I don't see a logo in the top left corner; there's the red block all across the top of the page, and then "Incentives" starts in the middle and the other choices go from the right there. It's unclear what you want to go back to the home page.

Answer 3

I'm unsure if this is a real question, given the simplicity of its answer. I can only assume I must've missed something obvious. But to address:

I need the logo in the top left corner to link back to the home page for this site.

There's this:

<div id="whatever_id">
<a href="path/to/page.html" title="path to page"><img src="path/to/image.png" alt="this is a link to whatever page." /></a>
</div>

To address:

I can't figure out how to make a tag have an anchor tag in it.

You can't, so far as I know, nest <a> tags. I could be wrong, but I'm sure that I read, on Eric Meyer's site (and no, I can't find the article, sorry) that it wasn't possible. It could be effected with JS, perhaps?

Answer 4

Since your entire header is one image (including the logo) you would need to use an image map to do it. I know Dreamweaver has an easy way to create those. Bing returns this for the first link.

Answer 5

You need to add a map tag that covers the area where the logo is.

Example: note that the co-ordinates need to be the actual coordinates for the area you want to be able to click.

<map name="logomap">
  <area shape="poly" coords="x1,y1,x2,y2,..." href="/" alt="Home" />
</map>

Answer 6

<div> is just a block tag.

The tags in HTML are divided in block tags and inline tags

<a style="display:block"> will act just like div. You replace tag by tag performing small changes in your css: adding {display:block} and maybe {text-decoration:none; color:black; cursor:normal}