I currently have a website (http://thetreehousedetectives.com/) which I was wanting to make into a fluid grid layout.
The background for the menu and footer extends all the way across the screen, but the content doesn't.
I'm using the Dreamweaver CS6 template for the fluid grid.
Does anyone know how I could achieve the same effect?
I don't have a whole lot yet, I just wanted to get a little bit of content in there first.
index.html - thetreehousedetectives.com/thethd/index.html
index.txt - thetreehousedetectives.com/thethd/index.txt
styles.css - thetreehousedetectives.com/thethd/styles.css
Btw, thank you so much for replying!
Try using background gradients. My example is a little crude so you'll need to play with it.
http://www.colorzilla.com/gradient-editor/
CSS:
html {background: #208FE5}
body {
background: #FFFFFF; /* Old browsers */
background: -moz-linear-gradient(top, #000000 0%, #ffffff 28%, #ffffff 71%, #208fe5 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#000000), color-stop(28%,#ffffff), color-stop(71%,#ffffff), color-stop(100%,#208fe5)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #000000 0%,#ffffff 28%,#ffffff 71%,#208fe5 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #000000 0%,#ffffff 28%,#ffffff 71%,#208fe5 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #000000 0%,#ffffff 28%,#ffffff 71%,#208fe5 100%); /* IE10+ */
background: linear-gradient(top, #000000 0%,#ffffff 28%,#ffffff 71%,#208fe5 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#208fe5',GradientType=0 ); /* IE6-9 */
}
NOTE: It won't look the same in pre-IE10 so you might want to feed those miserable browsers a background image instead of using IE filters.
Nancy O.
North America
Europe, Middle East and Africa
Asia Pacific