CSS - подходит 100% родительского пространства?

Question

Я хочу создать интервал внутри тега ссылки (href), я хочу, чтобы интервал занимал 100% ширины и высоты родительского элемента ссылки.Я пробовал с относительной / абсолютной позицией, но ничего не работает.

Пример:

http://jsfiddle.net/dDZRj/

Answer 1

Это все?

http://jsfiddle.net/dDZRj/11/

body {
    margin: 25px;
}

.button {
    margin: 5px;
    color: #fff;
    background: #999;
    display: inline-block;
    padding: 10px 0;
    text-decoration: none
}   

.button span {
    padding: 10px;
    border: solid 1px red;
    width: 100%;
}

.big {
    font-size: 2em;
}

Answer 2

Проверено в Chrome.

http://jsfiddle.net/loktar/dDZRj/4/

CSS

body {
    margin: 25px;
}

.button {
    margin: 5px;
    color: #fff;
    background: #999;  
}   

.button span {
    border: solid 1px red;
}

.big {
    font-size: 2em;
}

Разметка

<a href="#" class="button"><span>Click me!</span></a>

<a href="#" class="button big">
    <span>Click me!</span></a>

<a href="#" class="button">
    <span>Click me!</span>
</a>

Answer 3

В Firefox по крайней мере вам нужно изменить наш источник на:

<a href="#" class="button">
    <span>Click me!</span></a>

<a href="#" class="button big">
    <span>Click me!</span></a>

<a href="#" class="button">
    <span>Click me!</span></a>

Но в остальном CSS @ Loktar прекрасно работает:)

Answer 4

Я думаю, что это то, что вам нужно, a может иметь любой размер по ширине, а span отрегулирует его размер в соответствии. Ох, и там есть отступы.

http://jsfiddle.net/dDZRj/12/

Answer 5

Попробуйте изменить диапазон:

display: block;