Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jul 2006
    Thanked 0 Times in 0 Posts

    how to make a div from 200px tob to the bottom of browser?


    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?

  • #2
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Thanked 1,847 Times in 1,831 Posts
    Hello alapimba,
    Taken from this method of full height layout, 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>
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts