Всем привет!
Помогите решить проблему атрибута height:100% в Firefox. Вроде проблема распространенная, но все решения, которые нагуглил, у меня не сработали.
Итак, есть таблица, которая должна полностью помещаться на весь экран и не более. У нее есть строки/столбцы, размер которых задается в пикселях, остальные строки/столбцы должны растягиваться на все оставшееся пространства. То есть резиновость. В одной ячейке есть DIV с картинками; если картинок больше чем помещается на экран, то в DIV'е должен появляться скролл, то есть overflow-y:scroll. При этом весь сайт (вся таблица) не должен вылазить за границу экрана (браузера).
Вот пример который работает в Opera в точности так как мне нужно, но в FireFox размер DIV'a почему-то не уменьшается до нужной высоты.
(Картинку можете заменить на свою любимую)
Как заставить в FireFox показывать правильно?
<html>
<head>
<style type="text/css">
img{
display:block;
max-width:100px;
max-height:100px;
}
</style>
</head>
<body>
<table style="border:1px solid red;width:100%;height:100%;max-height:100%;">
<tr>
<td style="border:1px solid green;width:150px;height:100px;vertical-align:text-top;">text1</td>
<td style="border:1px solid green;">Text2</td>
</tr>
<tr>
<td style="border:1px solid green;vertical-align:top;">
<div style="height:100%;overflow-y:scroll;">
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
<img src="http://goasingingsuperstar.com/images/stories/sample_image1.jpg" />
</div>
</td>
<td style="border:1px solid green;">
<textarea style="width:100%;height:100%;">
</textarea>
</td>
</tr>
</body>
</html>
