html5 - Placing checkbox over an image without using 'top' and 'position:absolute'? -
is possible put checkbox on image without using 'top' , 'position:absolute' ? <div class="main"> <img src="http://www.standard.co.uk/incoming/article9760552.ece/binary/original/rooney.jpg" class="image"/> <input class="checkbox" type="checkbox" value="1" /> </div> jsfiddle there's few possible ways. if want avoid top , absolute position using negative margins. or if want checkbox checked when image clicked wrap image in label , tie label checkbox. i've done both here . html: <div class="main"> <label for="checkbox"> <img src="http://www.standard.co.uk/incoming/article9760552.ece/binary/original/rooney.jpg" class="image" /> </label> <input id="checkbox" type="checkbox" value="1" /> </div> css: .image { height: 200px; width: 250px; } ...