Page 1 of 1

background colours in 3 columns

Posted: Thu Jun 12, 2008 3:58 pm
by smiley
I would like to have 3 columns website, so I changed code in left sidebar + 1 column

instead of div#main and div#sidebar i put this code (like it write here http://forum.cmsmadesimple.org/index.ph ... l#msg69622 )

div#main {
   float: right;
   width: 57%;
   margin-left: 0px;
   margin-right: 16px;
   padding: 2px;
background-color: #e1ffe3;
}

div#sidebar {
   float: left;        /* set sidebar on the left side. Change to right to float it right instead. */
   width: 18%;     /* sidebar width, if you change this please also change #main margins */
   display: inline;  /* FIX IE double margin bug */
   margin-left: 1em;
background-color: #feff8d;
}

div#rightsidebar {
   float: right;
   margin-left: 3px;
   margin-right: 3px;
   margin-bottom: 5px;
   width: 19%;
   padding: 2px;
background-color: #aefff9;
}

On picture example1.gif I get this kind of background colour, but I would like that colour is full until down of page, like in example2.gif

How to make that colour in columns going to down of page?

Re: background colours in 3 columns

Posted: Thu Jun 12, 2008 4:12 pm
by nakkiel
It would seem that the banner div is not as long as your page... You could try to put min-height into that div?

Re: background colours in 3 columns

Posted: Thu Jun 12, 2008 4:59 pm
by KO
Easiest way to do is with "faux-columns" http://www.alistapart.com/articles/fauxcolumns/
Problem probably comes with widths set as %. Much easier with pixels.

Re: background colours in 3 columns

Posted: Fri Jun 13, 2008 11:32 am
by smiley
thank you thank you thank you :)
it's working!