CODEWITHSUNDEEP
csshtml
yuli chika
yuli chika

Reputation: 9221

How to set a div height in this situation?

How to set a div#wrap height in this situation?

<body style="height:100%;width:100%;overflow:hidden;padding:0;margin:0;">
<div id="header" style="width:100%;height:50px;z-index:5;background:blue;padding:0;margin:0;">&nbsp;</div>
<div id="wrap" style="width:100%;overflow:scroll;background:red;height:100%;padding:0;margin:0;">
<div id="content" style="width:100%;height:2000px;padding:0;margin:0;">
&nbsp;
</div>
</div>
<div id="footer" style="width:100%;height:30px;z-index:5;background:green;padding:0;margin:0;">&nbsp;</div>
</body>

Upvotes: 0

Views: 124

Answers (2)

DanTdr
DanTdr

Reputation: 424

you can't actually set the height of a div height : height:100%, you might want to try min-height:400px!important; _height:400px;

Upvotes: 0

nonopolarity
nonopolarity

Reputation: 150976

Is this what you are looking for?

http://jsfiddle.net/nkUwa/1/

try it in Firefox... I don't know a way to make the header and footer a fixed height, and then have the wrap and content the "remaining area" like for the frameset usage... But you can also style the header and footer as position: absolute and attached to the top and bottom of viewport, by using top: 0 and bottom: 0 respectively.

Upvotes: 1

Related Questions