View Full Version : how to make a div from 200px tob to the bottom of browser?

02-18-2011, 12:01 PM

I want to create a div that starts at top: 200px; and goes to the end of the browser, depending of the browser size/screen resolution it will allways grow to the very bottom.

I tryed with height: 100%; but i guess the css reads the browser height and makes it 100% it means i have a scroll on the side because it calculates 200px + 100% (i guess).

Anyone can help?

02-18-2011, 05:27 PM
Hello alapimba,
Taken from this method of full height layout (http://nopeople.com/CSS%20tips/full-height-layout/index.html), this should work -
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
html, body {
height: 100%;
margin: 0;
font: 100% Verdana, Arial, Helvetica, sans-serif;
color: #333;
background: #e0dac1;
#container {
width: 798px;
min-height: 100%;
margin: 0 auto;
border-right: 1px solid #000000;
border-left: 1px solid #000000;
background: #CBBE94;
#top {
height: 200px;
width: 800px;
margin: 0 -1px 0;
background: #e0dac1;
<div id="container">
<div id="top"></div>
<!--end container--></div>