Как добавить отступ или рамку в DIV и сохранить ширину и высоту?
Есть ли способ сохранить заданную ширину / высоту для DIV и дополнить содержимое без увеличения DIV? Смотрите пример ниже. Я хочу, чтобы все коробки были точно 140x140.
HTML:
<div class="box1">Howdy.</div>
<div class="box2">Howdy.</div>
<div class="box3">Howdy.</div>
CSS:
.box1 {
width: 140px;
height: 140px;
background: #f66;
}
.box2 {
width: 140px;
height: 140px;
background: #66f;
padding: 1em;
}
.box3 {
width: 140px;
height: 140px;
background: #6f6;
border: 1em solid #000;
}
Скрипки:http://jsfiddle.net/Wrc5S/