Высота стола 100% внутри элемента Div

Привет. Я хочу установить высоту таблицы 100% в свой родительский div без определения высоты в div. Мой код не работает. Я не знаю, чего мне не хватает. Fiddle ссылка

<div style="overflow:hidden">
<div style="float:left">a<br />b</div>
<table cellpadding="0" cellspacing="0" height="100%" style="border:solid 1px #000000">
<tr>
<td valign="middle">c</td></tr>
</table>
</div>

Ответы

Ответ 1

Невозможно без назначения значения высоты для div.

Добавьте это

body, html{height:100%}
div{height:100%}
table{background:green; width:450px}    ​

DEMO

Ответ 2

Вот как вы можете это сделать -

HTML -

<div style="overflow:hidden; height:100%">
     <div style="float:left">a<br>b</div>
     <table cellpadding="0" cellspacing="0" style="height:100%;">     
          <tr><td>This is the content of a table that takes 100% height</td></tr>  
      </table>
 </div>

CSS -

html,body
{
    height:100%;
    background-color:grey;
}
table
{
    background-color:yellow;
}

Смотрите DEMO

Обновление: Ну, если вы не ищете 100% -ную высоту для своих родительских контейнеров, то вот решение jQuery, которое должно вам помочь -

Демо -используя jQuery

Script -

 $(document).ready(function(){
    var b= $(window).height(); //gets the window height, change the selector if you are looking for height relative to some other element
    $("#tab").css("height",b);
});

Ответ 3

Вам нужно иметь высоту в div <div style="overflow:hidden"> иначе он не знает, что такое 100%.

Ответ 4

Была аналогичная проблема. Мое решение состояло в том, чтобы дать внутреннему столу фиксированную высоту 1px и установить высоту td во внутренней таблице на 100%. В любом случае, он отлично работает, протестирован в IE, Chrome и FF!

Ответ 5

чтобы установить высоту таблицы в свой контейнер, я должен сделать:

1) установите "position: absolute"

2) удалите избыточное содержимое ячеек (!)