CODEWITHSUNDEEP
cssinternet-explorer
Xtian
Xtian

Reputation: 3587

IE Issue - using a span in an anchor to make DIV clickable

I am using span to fill the entire width and height of a DIV inside of an anchor tag, so the entire DIV is clickable:

<style>
.container {
    background-color: #ffffff;
    float: left;
    height: 90px;
    margin-bottom: 10px;
    position: relative;
    width: 290px;
}

.container span {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
    z-index: 90001;
    display: block;
}

</style>


<div class="container">
    <a href="#" target="_blank">
        <span></span>
    </a>
</div>

Works great, but in IE 9 it doesn't seem to register. The DIV is not clickable, not sure why IE is having issues with this?

Upvotes: 0

Views: 1185

Answers (2)

What have you tried
What have you tried

Reputation: 11138

Instead, why not do this:

Working example:

http://jsfiddle.net/q3PCe/1/

<div class="container">
    <a href="#" target="_blank">

    </a>
</div>

CSS:

a{
    display: block;
    height: 100%;
    width: 100%;
}

Upvotes: 2

Mr. Alien
Mr. Alien

Reputation: 157314

So why you just don't make it something like this? And it should work

<a href="#">
   <div>
     <!-- Stuff goes here -->
   </div>
</a>

Or use onclick="window.location" for <div> (I won't use this approach)

Upvotes: 1

Related Questions