Я уверен, что эта проблема была задана раньше, но я не могу найти ответ.
У меня есть следующая разметка:
<div id="foo">
<div id="bar">
here be dragons
</div>
</div>
Мое желание состоит в том, чтобы foo имел ширину 600px
(width: 600px;
), и для создания бара были следующие типы поведения:
padding-left: 2px;
padding-right: 2px;
margin-left: 2px;
margin-right: 2px;
outerWidth: 100%;
Другими словами, вместо того, чтобы устанавливать ширину полосы в 592px
, я хотел бы установить внешнюю ширину строки на 100%
так, чтобы она была рассчитана на 592px
. Важность здесь в том, что я могу изменить ширину foo на 800px
, и балл будет вычисляться при визуализации вместо того, чтобы мне приходилось выполнять математику для всех этих экземпляров вручную.
Возможно ли это в чистом CSS?
Немного веселее:
- Что делать, если
#bar
является таблицей? - Что делать, если
#bar
является текстовым полем? -
Что делать, если
#bar
является входом? -
Что делать, если
#foo
является ячейкой таблицы (td
)? (Сможет ли это изменить проблему или проблема идентична?)
До сих пор обсуждался table#bar
, input#bar
. Я не видел хорошего решения для textarea # bar. Я думаю, что текстовое поле без рамки/поля/заполнения с оберткой div
может работать с стилем div
, предназначенным для работы в качестве границ для textarea
.