css - padding an <a> element inside a <div> to achieve a clickable box -


on website: http://www.bestcastleintown.co.uk/pg/

i trying coloured area of each <div class="awards_square_home"> click-able link nesting <a> tag inside <div> , adding padding. using padding on <div> position <a>. padding in rule:

.awards_square_home {     border: 10px solid rgb(195, 195, 195);     height: 90px;     margin-bottom: 20px;     padding: 90px 20px 20px; }  

now when add padding element not spreading padding in way desire, to make entire coloured area of div click-able.

.awards_square_home {     padding: 120px 0 20px; } 

i trying make <a> fill area of <div>:

enter image description here

if did not misunderstand you, want div clickable rather text only.

<a href="#" class="text220 centertext capitalise_text home_feature_turqoise ng">     <div class="awards_square_home turqoise podium">         <span>best</span>         <span>university</span>         <span>campaign</span>     </div> </a> 

fiddle here


Comments

Popular posts from this blog

Why does Ruby on Rails generate add a blank line to the end of a file? -

keyboard - Smiles and long press feature in Android -

node.js - Bad Request - node js ajax post -