Css - 100% + дополнение?
Как известно большинству людей,
100% div с отступом 5px на самом деле 100% + 10px.
Одно очевидное решение для этого - обернуть дочерний div в оболочку с маркой 10px
однако этот метод требует, чтобы вы добавили дополнительную разметку, я ищу способ сделать 100% + дополнение без дополнительного div.
любые идеи?
Ответы
Ответ 1
Элементы блока, такие как <div>
, автоматически принимают ширину 100% после заполнения. То есть вы должны иметь возможность добиться желаемого эффекта, просто указав заполнение, оставив ширину на auto
и убедившись, что элемент имеет display: block
(по умолчанию для <div>
).
http://jsfiddle.net/EMYBm/8/
Ответ 2
Вы должны изучить свойство CSS box-sizing
...
Я собрал пример, чтобы показать вам, как это работает, и разница между наличием свойства box-sizing
и отсутствием его. Посмотрите скрипку...
http://jsfiddle.net/UnsungHero97/bKsad/2/
Обратите внимание, что это не будет работать в IE7 или ниже:/
Надеюсь, это поможет.
Христо