View Single Post
  #3 (permalink)  
Old Apr 20th, 2008, 11:16
linchpin311 linchpin311 is offline
Junior Member
Join Date: Mar 2007
Location: Long Island, NY
Age: 23
Posts: 18
Thanks: 0
Thanked 0 Times in 0 Posts
Send a message via AIM to linchpin311
Re: Child div expand to fit parent?

wow, thats real clever the way you nested the div's like that. and it works great too!!

my code was just like:
Code: Select all
<html><head>

<style type="text/css">

body {
    height:100%;
    margin:0px;
    padding:0px; }

div.main {
    height:100%;
    width:984px;
    background-color:yellow; }

div.top {
    height:100px;
    width:100%;
    background-color:blue; }

div.middle {
    height:100%;
    width:100%;
    background-color:green; }

div.bottom {
    height:100px;
    width:100%;
    background-color:red; }

</style>

</head><body>

<div align="center">
<div class="main">

    <div class="top">header</div>
    <div class="middle">content</div>
    <div class="bottom">footer</div>

</div>
</div>

</body></html>
i gave my content its own div inside of the main div and as you can see the results would have never gave me the layout i was looking for.

on a short side note: ive noticed that when defining css attributes many people (you included, Bocaj) will say something like:
Code: Select all
#main {
    height:100%;
    width:984px;
    background-color:yellow; }

#top {
    height:100px;....so on and so forth
and then in the body put:

Code: Select all
<div id="main">text</div>
<div id="top">more text</div>
what is the difference between the class and id attribute? are there benifits to id over class? can you use class and id in the same div tag for even more control in your css stylesheets?
Reply With Quote