Search the Community
Showing results for tags 'height:100%'.
Found 2 results
-
Доброго времени суток, проблема у меня вот в чём: есть сайт http://www.lol.domstroi69.ru/proekti.html, ему задано html,body{height:100%//задал для того чтобы на мониторах разной высоты всегда была голубая полоска на всю высоту экрана}#wrap{height:100%;position:relative;}left-barBox{width:50px;backgeound-color:blue;height:100%;position:absolute;left:20px;}#footer{position:absolute;bottom:0;right:0;// футер который должен всегда находится внизу}Проблема в том, что когда я уменьшаю окно бразуреа по высоте или начинаю добавлять изображения в див с id='contentBox' у меня получается вот такая вот Ху... Всё конечно исправляется если я не указываю высоту html,body wrap height='100%' #footet clear:both, но тогда у меня левая менюшка будет на высоту забитого мною контента, а мне нужно чтобы была на высоту экрана браузера...
-
Мда )) Уже начал сходить с ума, пытаясь понять логику, по которой float-элемент игнорирует height и min-height в процентах. Оказалось дело в Firefox. Допустим, у нас есть float-блок, который находится в родителе. И нам нужно, чтобы даже при отсутствии контента (или малом количестве) у плавающего была бы какая-то минимальная заданная высота. Как бы логично и удобно использовать min-height, который берется от родителя. Но FF все обламывает. Понятно, что такую модель можно реализовать и по-другому. Но вопрос в том, что есть ли способ, не меняя подход, научить FF видеть эту высоту? Перед нажатием на "отправить" проверил в Хроме. Та же проблема. Тогда это уже интереснее. Кто может подсказать что-то на этот счет? Код онлайн Этот же код: <!doctype html> <html> <head> <meta charset="utf-8"> <title>float height:100% error</title> <style type="text/css"> html, body{ height:100%; } body{ margin:auto; } #main{ overflow:hidden; width:50%; min-height:70%; margin:auto; background:#ccf; } #left{ float:left; width:50%; min-height:100%; background:#ffc; } </style> </head> <body> <div id="main"> <div id="left">Плавающий блок</div> </div> </body> </html> У Оперы и даже jsfiddle.net все в порядке.
