min-width for entire page

Discussion in 'CSS' started by gucci09, Jan 11, 2007.

  1. #1
    how do create a min-width for the whole page so i can get a scroll bar on the bottom on resize?

    here is my code:

    html:
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
    <html>
    <head>
    <style>
    	
    </style>
        <link href="jvdt.css" rel="Stylesheet" type="text/css" />
    </head>
        <body>
    	
            <title>JVDT - CSS Test</title>
    
    	<div id="menu"><center>yellow</center></div>
    	<div id="tree">green
    	blahbbbbbbbbbbbbbbbbbbbbbbbbbbbbbb
    	<br />
    	valh
    	<br />
    	afadfdfa
    	<br />
    	dffad
    	<br />
    	fadf
    	<br />
    	dafa
    	<br />
    	dfadfaf
    	<br />
    	dafadf
    	<br />
    	afdfad
    	<br />
    	fadfa
    	<br />	
    	dfadfad
    	<br />
    	fdf
    	<br />
    	fdfadfdaf
    	<br />
    	d
    	<br />
    	fda
    	<br />
    	fad
    	<br />
    	f
    	<br />
    	ad
    	<br />
    	fad
    	<br />
    	f
    	<br />
    	ad
    	<br />
    	fa
    	<br />
    	d
    	<br />
    	fa
    	<br />
    	df
    	<br />
    	ad
    	fd
    	fa
    	d
    	f
    	daf
    	afd
    	adsf
    	
    	</div>
    	<div id="input">orange
    	adkfljadl;f
    	<br />
    	adfadfdaf
    	<br />
    	adfadfadfad
    	<br />
    	afdafdfdaf
    	<br />
    	hthgjyud
    	<br />
    	agdfgfagfafg
    	<br />
    	adfadffdafgasghg<br />
    	<br />
    	afdedf
    	<br />
    	<br />
    	adfadfadfdhhhhhhhhhhhhhhhhhhhhhhhhhjjjjjjjjjjjjjjjjjjjjjjhhhjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjjj
    	<br />
    	adfadffhfgd
    	<br />
    	adfahgrfd
    	<br />
    	fddagf
    	<br />
    	dfadfag
    	<br />
    	afdafafsc
    	<br />
    	adfdadfdfa
    	<br />
    	daffaaf
    	
    	</div>
    	<div id="description">lightblue
    	dafdfdsxd<br />
    	<br />
    	dfdafdfhhhhhhhhhhhhhhhhhhhhhhhhhhggggggggggggggggggggdffddddddddddddddddddddddddddddddddd
    	<br />
    	afadffad
    	<br />
    	adfadfadfd
    	<br />
    	adfafadfgdaf
    	<br />
    	adfafdfa
    	<br />
    	afdfadfdag
    	<br />
    	dafdffdadfag
    	<br />
    	dfa
    	<br />
    	dfad
    	<br />
    	dagafg
    	<br />
    	dfgfhghh
    	<br />
    	dfadhfhsf
    	<br />
    	fagafhafg
    	<br />
    	fdgdfgagg
    	<br />
    	agshhgfghs
    	<br />
    	gffdgfhgfh
    	<br />
    	agfhhgs
    	<br />
    	dgadgharf
    	<br />
    	dgfdgh
    	<br />
    	dgdagfgdagda
    	
    	</div>
        </body>
    </html>
    
    Code (markup):
    CSS:
    
    
    html,body{
    	height: 100%;
    	width: 100%;
    	min-height:600px;
    	min-width:300px;
    	
    	
    
    	
    }
    * {
    	
    	margin: 0;
    	padding: 0;
    	
    	
    }
    
    
    #container {
    	height:100%;
    	width: 100%;
    	background: #000000;
    	min-width:300px;
    	
    	
    	
    	
    	
    }
    #menu {
    	width: 100%;
    	height:10%;
    	position:relative;
    	background: yellow;
    	overflow:auto;
    	
    }
    #tree {
    	float:left;
    	width: 30%;
    	height: 90%;	
    	background: green;
    	overflow:auto;
    	
    }
    #input {
    	width: 70%;
    	height: 60%;
    	float: right;
    	position:relative;
    	background: orange;
    	overflow:auto;
    	
    }
    #description {
    	width: 70%;
    	height: 30%;
    	float: right;
    	position:relative;
    	background: lightblue;
    	overflow:auto;
    }
    Code (markup):
    i know there is alot of nonsense going on in the html but i was using that to test the scroll bars
     
    gucci09, Jan 11, 2007 IP
  2. EvilivE

    EvilivE Peon

    Messages:
    23
    Likes Received:
    2
    Best Answers:
    0
    Trophy Points:
    0
    #2
    I replied to your original post over here: http://forums.digitalpoint.com/showthread.php?t=216399
     
    EvilivE, Jan 11, 2007 IP