Neverside

CSS Problem

Basic 3 column layout w/o a copyright bottom.

Code:

<div id="site">
<div>Banner</div>
<div id="wrapper">
<div id="left">
Left
</div>
<div id="main">
Middle b
</div>
<div id="right">

Right
</div>
</div>

<div id="copy">
Copyright
</div>
</div>

The CSS:

Code:

html, body {
margin: 0;
padding: 0;
text-align: left;
background: #4A555A;
font: x-small/1.6em Verdana, Sans-serif;
color: #444;
}

a:link, a:visited {
color: #636D7B;
text-decoration: none;
}

a:hover {
color: #FFFFFF;
text-decoration: none;
}

a:active, a:focus {
color: #636D7B;
text-decoration: none;
}

img {
border: none;
}

form {
background: #FFF;
margin: 0px;
padding: 4px;
}

input, textarea, select {
margin: 1px 0;
font-size: 100%;
}
input.text, textarea.text {
background: #FFF;
border: 1px solid #FF9400;
color: #444;
}

tr, td {
vertical-align: top;
font: normal 11px/16px Verdana, Arial, Helvetica, sans-serif;
}

#site {
background-color: #636D7B;
width: 892px;
text-align: left;
margin-left: auto;
margin-right: auto;
padding: 0px;
}

#wrapper {
margin-top: 5px;
padding: 0;
}

#right {
float: left;
margin-right: 1px;
width: 150px;
}

#left {
float: left;
margin-left: 1px;
width: 150px;
}

#main {
float: left;
margin: 0 9px;
width: 572px;
}

#copy {
background-color: #FFF;
}

For some reason, the copyright background color above it too instead of just that area.

I'm trying to have the middle part below banner and aboev copyright to be another color, and the left right right to be separate colors. How can I do that. My wrapper won't do it.

Attached is what i mean about the middle part and the 3 columns.

I'm not really sure what your problem is but if you want to assign a different background color to #left, #main, #right or #copy just use 'background: #333;', for example.

___________________

sixminutes.ca

no no, I know that part,I mean, I want the background that the #left #right and #main are over to be a different color.

EDIT: See attachment. That's in HTML, but I'm trying to do this in CSS divs.

Last edited by heyden, October 11th, 2005 05:21 AM (Edited 1 times)

add
background:red;
to div #left, #main, and #right

to change the color of the white one, i think you would use
background:red;
to div #wrapper

___________________

scudworkz.com.

offtopic: how are you liking dw8? I <3 it so far

___________________

Neverside Development Director
PHP Snippets
BigToach.com - IT WORKS, TOACHY!

coolaid: I tried that, doesn't change anything to my wrapper area. I know I can do this in HTML, but I wanted to try this in CSS divs . I'm going to mess with it a lot tomorrow after I get my college work out of the way.

bigtoach: I <3 dw8.

Anyone have any ideas? I'm still working on this

that should work, you must have some other rules that are conflicting or something like that.

___________________

Neverside Development Director
PHP Snippets
BigToach.com - IT WORKS, TOACHY!

ok, you're css is already all screwed up... anway, at your current state, you would have to edit the
background-color:#fff;
of the #copy to change the white behind the 3 columns.. i suggest you code it yourself and not let dreamweaver do it for you

___________________

scudworkz.com.

I am coding this myself...I don't know, but my wrapper just doesn't want to change, it only affects the banner area.