Take the 2-minute tour ×

I have seen applications that consume all the available space of browser window without any scroll bars on browser window, but scroll bars for specific divs (for instance, jsfiddle, which uses scroll bars for html, css, javascript and results divs but no browser window scroll bars). I am trying to develop such layout for my application and I have tried some keywords like Application style UI, 100% Height width layouts, fluid layout but none of them seems to return desired results. Pardon me but as a beginner I have to ask this. Is there a specific term for such layouts. I did came across few techniques and jquery plugins to achieve this but still wondering what would be the best way to go about it. Links suggestions are more than welcome.

share|improve this question
add comment

3 Answers

up vote 1 down vote accepted

This is very basic stuff.

First you have to set the height property of the html, body in CSS

html, body {

The overflow to hidden will hide the scrollbars for your window.

Then you define a div in your HTML and assign the div a classname like .foo

.foo {

By setting the overflow to auto, your div will take care of the scrolling of it's content.

Take a look: http://jsfiddle.net/mXU3f/

share|improve this answer
really?? I thought there would be more to this.. since the posts I read about application style layout really made me think so.. –  ZedBee Feb 2 '13 at 19:51
That's all, have fun! –  tomaszbrue Feb 2 '13 at 19:53
add comment

Take a look at this blog post. The selected answer above is a bit too simplistic for a full screen web application UI.


Some basic CSS gets you pretty far in building your full screen, 100% height, or whatever you want to call it, web application UI.

share|improve this answer
add comment

maybe this can help as i understaind you:


    <div id="container">
<div class="box">


        #container {
        height: auto !important;

.box {
    height: 200px;
width: 200px;
 overflow-y: scroll;
share|improve this answer
here is ex. jsfiddle.net/j75jr –  Mirko Mukaetov Feb 2 '13 at 19:49
add comment

Your Answer


