WeLoveCSS Logo
Home Profile Members Search Rules Help New Posts



WeLoveCSS > PROGRAMMING LANGUAGES > Scripting and Server Side > extending multiple divs to fill the screen

Reply
  Thread Tools Display Modes
Old 10th January 07, 04:16 PM   #1
gucci09
WLC Member
 
Join Date: Jan 2007
Posts: 6
Default extending multiple divs to fill the screen

am very new to CSS. I am trying to make a site that contains 4 divs. One on top that stretches accross the page whos height is 100px. One on the left side below the top that is 30% of the page width but extends to the bottom. and two on the right thatwhos widths are 70% of the page and who stretch to the bottom. The top one on the left needs a height of 70%, and the bottom one on the right needs a height of 30%-100px. i have the divs in their places but i do not know how to do the heights. please help!


html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<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</div>
<div id="input">orange</div>
<div id="description">lightblue</div>
</body>
</html>





css code:
#menu {
background: yellow;
position:relative;
width: 100%;
height:100px;
}

#tree {
background: green;
float:left;
width: 30%;
position:relative;
bottom: -2px;

}

#input {
background: orange;
float:right;
width: 70%;
position:relative;
bottom: -2px;
right:-2px;




}

#description {
background: lightblue;
float:right;
width: 70%;
position:relative;
bottom: -4px;
right: -2px;

}
gucci09 is offline   Reply With Quote
Old 10th January 07, 06:54 PM   #2
gucci09
WLC Member
 
Join Date: Jan 2007
Posts: 6
Default Re: extending multiple divs to fill the screen

never mind i got some help and i figured it out
gucci09 is offline   Reply With Quote
Reply


Thread Tools
Display Modes
Linear Mode Linear Mode

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump

Similar Threads
Thread Thread Starter Forum Replies Last Post
[SOLVED] Help with Sticky Footer wyclef CSS 2 18th December 06 10:29 PM
Strange problem with nested div's in IE emjay1 Browser Compatibility 2 1st September 06 05:28 PM


All times are GMT. The time now is 12:04 AM.



Home | Advertise | Contact Us | Top
Home | Advertise | Contact Us | Top

Copyrightę 2006 WeLoveCSS.com. All Rights Reserved.
Powered by vBulletin Version 3.8.4 Copyright ©2000 - 2017, Jelsoft Enterprises Ltd.