PDA

View Full Version : How to make whole DIV clickable?



kodegeek
May 25th, 2016, 08:42 PM
I have an image, while hovering on image need to Show a div with background color white transperent with dummy text and button(horizontally and vertically center aligned) and the whole div should be clickable.

Exisitng structure: donít change anything add markup.

.modernsubcat .fitdetials {
height: 294px;
width: 552px;
padding-right: 25px;
padding-bottom: 60px;
}
.modernsubcat .morecolors {
margin: 60px 0 80px 0;
clear: both;
text-align: center;
padding-top: 32px;
}
.modernsubcat .morecolors a {
background: #333;
padding: 18px 66px;
text-decoration: none;
color: #fff;
font-size: 16px;
}

<div class="modernsubcat">
<div class="fitdetails">
<img src="img01.jpg" width="552" height="294"/>
<div class="morecolors" >
<a href="javascript:void(0);">shopnow</a>
</div>
</div>
</div>

sunfighter
May 25th, 2016, 09:31 PM
If the whole DIV is clickable why have a button?
Running your code I have a white back ground, how is a white DIV going to show up?

deathshadow
May 26th, 2016, 12:43 AM
If you want the whole DIV clickable, why are you using a DIV and not an anchor?

... and yeah, what Sunfighter said too.