[thelist] CSS div inheret height?

Info@internetvraagbaak.nl info at internetvraagbaak.nl
Sat May 6 04:28:23 CDT 2006


Hi!

I am struggling a bit with some div's i put in a container div.
Have a header div and then three columns.
The Middle column will be the one that expands because of the content. The left and right should adjust their length to that one...
* Have a demo url to the website but do not dare to put it in here to avoid it get's indexed somehow ;-)

CSS and webpage validate fine.... and i got it working crossbrowser ...only this "problem" is left.. Think i just lack some knowlegde to 
get the right behaviour. 

here is my stylesheet:

html {
 height:100%;
}
body {
   background-color: #465242;
 margin-left: 0px;
 margin-top: 4px;
 margin-right: 0px;
 margin-bottom: 2px;
 font-family: Tahoma, serif;
 font-size: 90%;
 color: #fdfdfc;
 height: 98%;
 padding: 0px;
}
div#container {
 width: 960px;
 background-color: #fdfdfc;
 color: White;
 margin-right: auto;
 margin-left: auto;
}
div#header {
 width: 920px;
   padding-left: 20px;
 background-color: #fdfdfc;
 color: White;
 padding-right: 20px;
 padding-top: 15px;
 padding-bottom: 0px;
 height: 151px;
}
div#leftcontainer {
 width: 180px;
 clear: right;
 float: left;
 margin-top: 1px;
 }
div#left { 
 width: 180px;
 height: 28px;
 background-image: url(../images/bar-l.gif);
 margin-left: 20px;
 margin-top: 0px;
}
div#navigation {
 /*background-color: #2e332c;*/
 width: 180px;
 height: 350px;
 background-image: url(../images/back-l.gif);
 margin-left: 20px;
}
div#cartesians {
 width: 180px;
 background-color: #151814;
 color: White; 
 margin-left: 20px;
}
div#rightcontainer {
 float: right;
 width: 180px;
 padding-right: 20px;
 margin-top: 1px;
}
div#portfolioheader {
 width: 180px;
 height: 13px;
}
div#portfolio {
 width: 180px;
 height: 468px;
   background-image: url(../images/back-r.gif);
}
div#contentcontainer {
   padding: 14px 213px 0px 213px;
 margin: 0px;
 height: auto;
}
div#contentheader {
 height: 21px;
 background-color: #151814;
 width: 526px;
 color: Black;
 background-image: url(../images/contentheader.gif); 
 margin: 0px;
}
div#content {
 margin: 0px;
 width: 526px;
 height: 446px;
 background-image: url(../images/back-m.gif);
}
div#footer {
    clear: both;
  background:#fdfdfc;
 color: Black;
 height: 20px;
}
div#footer p {
 font-size: 9px;
 text-align: center;
 padding-top: 5px;
}
  a.. H1 {
   font-size: 16px;
  }
  H2 {
   font-size: 14px;
  }
  H3 {
  font-size: 12px;
  }



More information about the thelist mailing list