html - How-to mix fixed and percentage heights/width using css without javascript -



html - How-to mix fixed and percentage heights/width using css without javascript -

i want accomplish layout this:

----------------------------------------------------------- | | | fixed height | | | |----------------------------------------------------------| | | s | | takes rest available screen height | c | | fluid height, not fixed, | r | | dependent on screen height | o | | | l | | | l | | | b | | | | | | r | ------------------------------------------------------------

using css , html, without javascript, possible? scrollbar should visible, top bottom.

see: http://jsfiddle.net/s7fh6/show/ (edit)

html:

<div id="header"></div> <div id="content"></div>

css:

html, body { margin: 0; padding: 0; overflow: hidden } #header { background: #ccc; position: absolute; left: 0; top: 0; width: 100%; height: 150px } #content { background: #eee; position: absolute; left: 0; top: 150px; bottom: 0; width: 100%; overflow-y: scroll }

html css layout

Comments

Popular posts from this blog

iphone - Dismissing a UIAlertView -

intellij idea - Update external libraries with intelij and java -

javascript - send data from a new window to previous window in php -