Решить задачу по размерам блоков без box-sizing

[skvor]

Дано: <div><div></div></div>

Надо согласовать внешние размеры вложеного div'a с внутренними родительского.

<div style="border: 100px solid #f44; width: 80%; height: 500px; padding: 80px;">
<div style="border: 80px solid #44f; width: 100%; height: 100%; top: -80px; left: -80px; position: relative;">
Решено, но использование padding родителя и позиционирование дочернего элемента не логично, т.к. взаимосвязано с шириной border.
</div>
</div>

<div style="border: 100px solid #f44; width: 80%; height: 500px;">
<div style="border: 80px solid #44f; width: 100%; height: 100%;">
Не решено.
</div>
</div>

Первый вариант внешне решает вопрос, но требует лишнего позиционирования с параметрами от родительского, которые логически не согласуются.

Суть проблемы - вложеному элементу надо назначать полные ширину и высоту в пропорциях от внутренних размеров родителя.

[Zippovich]

с width:100% я не вижу проблемы, т.к. <div> изначально будет занимать width:100% без учета паддинга родителя, если не задавать width

а вот с height не знаю, без box-sizing

[skvor]

С width тоже проблема, т.к. речь не о 100%, а о невозможности согласовать размеры.

Если задать ширину 50% для вложеных блоков, то они будут одинаковыми, и у второго варианта внутренний размер будет согласован с внутренним же размером родителя (а хочется, чтоб он (к примеру) по габаритам занимал половину ширины области для контента родителя). А вот первый вариант из-за хрени с padding'ом и позиционированием будет сломан.

[SelenIT]

display: table/table-cell (+, возможно, table-layout:fixed)?

[skvor]

Спасибо, работает. Ещё один аргумент для табличной вёрстки и плевок в ТБЛ