CODEWITHSUNDEEP
htmlcssinternet-explorer
brendo
brendo

Reputation: 2924

Z-index over an img?

Consider this page @ http://www.bloodbone.ws/screwed.html

I need to be able to have the a.grow element expand to the dimensions of the div.column-header so that if you target anywhere in the div the whole area is clickable.

It works in Firefox + Safari, but I can't get it to work in any IE browser.

The h2 and img elements always break the a.grow so there are areas that aren't clickable.

I've tried everything I can think of, adding zoom: 1 etc. to no avail.

The h2 and img have to be visible, but any mouse hover over the area should be clickable.

Upvotes: 2

Views: 2781

Answers (2)

yoda
yoda

Reputation: 10981

To have it "SEO compatible", you have 2 options:

  1. Aplly several anchor tags to cover all your div;
  2. Use a framework like JQuery to make the div clickable (and when clicked follow the anchor href), and mantain the anchor inside the div for SEO purposes.

Upvotes: 3

lock
lock

Reputation: 6614

will 

    <div class="column-header">
        <a class="grow" href="http://www.google.com">Google</a>     
        <h2>What's On</h2>
        <a href="http://www.google.com">
            <img src='http://www.bloodbone.ws/images/mainHeader.jpg' alt='boo' />
        </a>
    </div>

do?

Upvotes: 0

Related Questions