html - display:block の div の高さ全体をアンカーにする

Question

私は単純なhtmlを持っています:

<div class='mydiv'>
    <a href='#'>Link</a>    
<div>

そしてCSS：

div.mydiv { height: 200px; width: 200px; background-color:red; }
div.mydiv a { display:block; color:yellow; background-color:green; }

アンカーがdivのスペース全体を占める必要があるため、display:block;を追加しました。私のcssに、divの一番上の行だけを占めています。

何が問題で、どうすれば修正できますか? ありがとう

Answer 1

height:100%アンカー CSSに追加します。

div.mydiv a {
    display:block;
    color:yellow;
    background-color:green;
    height:100%;
}

jsFiddle の例

Answer 2

このようにアンカーの高さを定義できます

a {height: 100%}