Sat, 2004-07-31 20:47
Hi all, CSS n00b here... Been studying lots of sites (csszengarden, mezzoblue, ALA, CSS Vault, etc.) and tutorials over the past week and started creating a new site and now I'm updating an old one.
Just had a quick question regarding background-color, which I set in the body section of my stylesheet. I have a container that is 800px wide and I want the background outside the container to be a certain color.
In IE, the background color I specified in the body section appears outside the container, but when using a gecko browser (firefox, mozilla) the specified color doesn't appear. I know gecko is much more standards-compliant regarding CSS, but why doesn't the background color appear in gecko browsers?
I could probably just create another 'container' that spans the entire browser, but just wondering if that would really be necessary.
Yes, I've tried both background: #xxx and background-color #xxx and neither work; and, yes, I searched (here and Google) before asking.
I'll keep looking at examples and try to figure it out in the meantime. If it's necessary, I'll post the stylesheet.
Sat, 2004-07-31 21:20
#1
background-color outside container?
Please post either a link to the site or the HTML and CSS used. Thanks!
Sun, 2004-08-01 01:45
#2
background-color outside container?
Removed links; problem solved (see below).
Sun, 2004-08-01 03:53
#3
background-color outside container?
My $.02
I have found that Mozilla, and Netscape to not like attached Sheets for body elements.
What I have been doing until (I find a better way) is to place body elements within the page itself and then attach the
.blah blah
#blah blah
elemnets on a sheet.
For Example put these elemnts on the page itself
Quote:
body {
background: #AAAAAA;
color: #333333;
margin-top: 0px;
margin-left: 0px;
margin-right: 0px;
margin-bottom: 0px;
padding-top: 0px;
padding-left: 0px;
padding-right: 0px;
padding-bottom: 0px;
font-family: sans-serif;
font-size: .8em;
line-height: 100%;
}
a:link {
color: #236;
text-decoration: none; background-color: transparent;
}
a:visited {
color: #568;
text-decoration: none; background-color: transparent;
}
a:hover {
color: #fff;
text-decoration: none; background-color: #666;
}
a:focus {
color: #fff;
text-decoration: none; background-color: #666;
}
a:active {
color: #454;
text-decoration: none; background-color: transparent;
}
acronym {
border: none;
cursor: help;
}
p { text-indent: 0em;
}
h1 { color: #661122;
font-family: Times, "Times New Roman", serif;
font-size: 1.2em;
line-height: 100%;
}
And attach the rest.
Sun, 2004-08-01 15:18
#4
background-color outside container?
Try taking the style tag out of the css document and it should work.
Sun, 2004-08-01 20:07
#5
background-color outside container?
Yep, that did the trick. Thanks a lot.