Да бы не плодить лишних тем и что бы ответы хранились в одном месте, спрошу здесь, ибо та же проблема. Содержимое является форма и div не хочет растягиваться по высоте. Что имеем. (убрал лишнее, оставил лишь структуру грубо говоря) <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <link rel="stylesheet" type="text/css" href="/static/css/main.css" /> </head> <body> <div class="main-block"> <div class="top-block"> <img src="/static/images/logo2.png" class="logo-top"/> <div class="contacts"> <p></p> <p></p> </div> </div> <div class="actions-horizontal"> <ul class="actions-horizontal-list"> <li><a href="/"></a></li> <li><a href="/"></a></li> </ul> </div> <br /> <div class="center-content-block"> <div class="reservation-form"> <form action="/reservation/" method="post"> <div style='display:none'><input type='hidden' name='csrfmiddlewaretoken' value='d4b5c16ef1a06db1127d3f82602e8fa0' /></div> <div class="field"> <div class="label"> <label for=""></label> </div> <div> <input type="text" maxlength="100" /> </div> </div> <div class="field"> <div class="label"> <label></label>: </div> <div> <input type="text"/> </div> </div> <input type="submit" value="Submit" class="button"/> </form> </div><!--div reservation-form --> </div> <!-- center-content-block --> <div class="bottom-footer"> </div> </div><!-- div main-block --> </body> </html> И вот такие вот стили (тоже убрал лишнее. Оставил отступы, поля, размеры и расположения). html, body { margin:0 0 0 0; padding:0 0 0 0; min-height:100%; height:100%; width:100%; position:absolute; } /* main block home page */ .main-block { top:5%; position:relative; top:5%; width:80%; min-height:95%; height:95%; left:10%; border-radius:25px; } .actions-horizontal {position:relative; left:5%; padding:5px; width:90%; height:6%; margin-top:10px;} .actions-horizontal ul { list-type:none; list-style:none; margin:0px; padding:0px; } .actions-horizontal ul li { margin-right:25px; margin-left:15px; float:left; margin-top:5px;} .center-content-block{ position:relative; top:5%; width:100%; overflow:hidden; overflow-x: hidden; overflow-y: auto; } /* reserve_form.html*/ .field { margin:5px; color:black; position:relative; } .center-content-block .reservation-form{ height:100%; position:relative; left:40%; width:150px; } .center-content-block .button { position:relative; left:25%; } .contacts {float:right; width:35%; margin-top:20px; position:absolute; top:2%; right:1%; font-size:150%; border-radius:15px;} .logo-top {width:450px; height:150px; left:1%;position:relative; top:4%;} .contacts p {margin:0 0 0 0; text-align:center;} Как должно выглядеть. По центру страницы основной блок, в котором все хранится. Он с отступом сверху, и что бы удлинялся вниз в зависимости от контента. P.S. исправил чуток, перенес overflow в main-block, добавилась прокрутка, форму тоже прикрыл нормально фон, но не совсем что нужно. Как сделать без прокрутки, что бы страница удлинялась по высоте. Гуглил, пробовал по разному, добавлял div со стилем clear:both или что то в этом роде, пробовал min-height, overflow, почему то не помогает, мб не туда это юзал, ибо новичек пока что. Кстати если есть нарекания по верстке или стилям, просьба их тоже высказывать, ибо только учусь. Заранее благодарен за помощь. P.S. Решил. Добавил в main-block min-height:95%;height:auto; и стало норм. Ток одна фигня проявилась, в опере не работает margin-bottom:5%; В ИЕ9 норм, в опере не хочет... Мб тут кто ответит или в другом топике спросить? Параметр задаю для main-block.
