Как визуально развернуть элемент HTML в блоке div?

Question

Я разделил свою HTML-страницу, используя блоки div. В одном из блоков div я создал таблицу. Я хочу, чтобы ширина этой таблицы увеличилась до всего доступного пространства.

2 проблемы: A) Если я установлю ширину таблицы на 100%, она будет расширяться до размера всей страницы, а не блока div. B) Более того, он не обрезается родительским блоком div (то есть переполняется).

Если я использую фреймы, эта проблема исчезнет ... но я не хочу использовать фреймы.

У кого-нибудь есть решение с использованием HTML / CSS?

Answer 1

Вам нужна статическая ширина в вашем контейнере div:

div.container { width: 400px; overflow: hidden; }
div.container table { width: 100%; }

<div class="container">
  <table><tr><td>something</td></tr></table>
</div>

Answer 2

Возможно, вы хотите установить атрибут position таблицы в relative, чтобы относительный размер работал.