html填充100%,如何在html中将锚元素的高度填充到100％？

我创建了一个高度为50px的顶部栏,然后是一个锚元素,锚点元素与它的填充应该与顶部栏高度完全相同.

在主流浏览器中测试代码时,Firefox已经给出了顶部栏到锚元素的精确像素高度,但在Chrome和IE中,它的结果为-1px.

Fiddle Here

HTML：

Text Here

CSS：

div {

width: auto;

height: 50px;

background-color: #333;

}

a {

padding: 10px;

display: inline-block;

font-size: 24px; /* Adjusting this would affect element block size */

color: white;

font-family:'Bebas Neue';

background-color: #777;

}

a:hover { background-color: green; }

我怎样才能填写< a>的尺寸.锚元素达到div的高度？