Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Set link height to 100% of it's parent

Tags:

css

height

If I have division with height: 100px; and it contains a link inside - can I make link fill the height of the division without hard-coding the value?

<div><a href="#">hello</a></div>

div {
    height: 100px;
    width: 100px;
    background: red;
}

a {
    background: green;
    height: 100%; /* This does not work. Is it possible to set this height to 100% of container? */
}

Fiddle: http://jsfiddle.net/nPL65/

like image 776
Stan Avatar asked Mar 10 '13 17:03

Stan


1 Answers

Add:

display: block;
height: 100%;

Though I don't know if you mind the link spanning the width of the <div>

If you do just set the <a> to display: inline-block;

jsFiddle

like image 108
Adrift Avatar answered Sep 29 '22 12:09

Adrift