Jump to content
  • 0

Как установить высоту дива, вложенного в другой див во всю высоту экрана браузера, без яваскрипта?


riki
 Share

Question

привет,

html,body{height: 100%;}.page{overflow: hidden;min-height: 100%;} .c1{width: 50%;float: left;}.c2{width: 200px;float: left;;padding: 0 10px 0 10px;}.c3{width: 50%;float: right;;}.c1 .wrp { height: 100%; margin-right: 100px;padding: 10px;}    .c3 .wrp {height: 100%; margin-left: 100px;padding: 10px;}
<div class="page"> <div class="c1"><div class="wrp"></div></div> <div class="c3"><div class="wrp"></div></div> <div class="c2"> </div></div>
Нужно дивы .c3.wrp и .c1.wrp растянуть на 100% экрана, его родитель .с1 имеет своего родителя .page - который на сто процетов экрана растягивается, но див .с1 почему не воспринимает высоту .page. Соотвественно и див .c1.wrp по высоте не растягивается.Можно ли без js сделать это? Edited by riki
Link to comment
Share on other sites

5 answers to this question

Recommended Posts

  • 0

Может .с1 не воспринимает высоту потому, что у родителя не задана высота?

Можно использовать position:absolute;

А box-sizing я даже не представляю что-то, как может помочь

 

И если эти блоки должны быть на высоту экрана, а не страницы, так и вкладывайте их на том же уровне что и блок .page 

Edited by Switch74
Link to comment
Share on other sites

  • 0

Может .с1 не воспринимает высоту потому, что у родителя не задана высота?

 

Ну как же не указана - если

.page{overflow: hidden;min-height: 100%;} 
Можно использовать position:absolute;

 

Резиновый макет нельзя - расползаются  блоки(кстати сам макет взят с этого сайта http://htmlbook.ru (центральная фиксированная - боковые резиновые)

Link to comment
Share on other sites

  • 0

Что то вы накрутили такую структуру что я не могу понять что вы хотите... Было бы замечательно начать с самого начала и увидеть дизайн того что вы хотите сделать. А то тут резина - не резина, абсолют - не абсолют, у кого 100%, а у кого не 100, бокс сайзинг еще... я пока в вашу беседу не могу въехать :D  

Нужно дивы .c3.wrp и .c1.wrp растянуть на 100% экрана, его родитель .с1 имеет своего родителя .page - который на сто процетов экрана растягивается, но див .с1 почему не воспринимает высоту .page. Соотвественно и див .c1.wrp по высоте не растягивается.Можно ли без js сделать это?
 

тут я вообще запутался  :)

возможно другая структура в вашем случае оптимальнее подойдет. а если пишете код, то выкладывайте его пожалуйста здесь http://jsfiddle.net/ так будет нагляднее. 

Link to comment
Share on other sites

  • 0

min-height не тоже самое что height

первый указывает лишь, ограничение размера, но не сам размер

размер блока может быть и больше min-height, если содержимое блока будет растягивать его

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy