Log in

View Full Version : background color in css with xhtml


emanuelle
07-02-2008, 08:32 AM
I am trying to give a background color to my page.
I have to work with XHTML and firefox

I have tried in the body class(in the css file), i tried to add it in the body tag in the document. Nothing works.

My page needs to have a height 100% and this also doesnt work

my doctype is
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
I cannot change this

any sugegstions?
rangana
07-02-2008, 08:39 AM
Please show us your CSS and the rest of your markup (HTML) that is involved.
coothead
07-02-2008, 09:43 AM
Hi there emanuelle,

my doctype is...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

I cannot change this
Well, you will have to change it, as you seem to have a foot in each camp. :eek:

The transitional dtd is...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
...and the strict dtd is...

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

coothead
emanuelle
07-02-2008, 09:52 AM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<style>
BODY{
margin-right : 0px;
margin-left : 0px;
margin-top : 0px;
margin-bottom : 0px;
background-color:#F6F9F0;

}
</style>
</head>

<body>
<table width="100%" cellspacing="0" cellpadding="0" height="100%">
<tr><td>i want the table to have 100% height andthe bg color to be #F6F9F0</td></tr>
</table>


</body>
</html>
coothead
07-02-2008, 10:07 AM
Hi there emanuelle,

try it like this...


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<style type="text/css">
html,body {
height:100%;
margin:0;
padding:0;
background-color:#f6f9f0;
}
table {
width:100%;
height:100%;
}
</style>

</head>
<body>

<table><tr>
<td>I want the table to have 100% height and the bg color to be #F6F9F0</td>
</tr></table>

</body>
</html>

I also recommend that you read a few of these links...



A better way to build your website (http://www.boagworld.com/archives/2004/06/a_better_way_to_build_your_website.html)
Why tables for layout is stupid: problems defined, solutions offered (http://www.hotdesign.com/seybold/index.html)
Ten ways to speed up the download time of your web pages (http://www.webcredible.co.uk/user-friendly-resources/web-usability/speed-up-download-time.shtml)
Nested Tables: About the (ab)use of tables as layout tools in webpages. (http://www.dorward.me.uk/www/nested/)
Why Tables Are Bad (For Layout) Compared to Semantic HTML + CSS (http://www.phrogz.net/CSS/WhyTablesAreBadForLayout.html)
Why go table free? (http://www.workingwith.me.uk/tablefree/why/)
Why avoiding tables (for layout) is important (http://davespicks.com/essays/notables.html)


coothead
jscheuer1
07-02-2008, 10:11 AM
In xml/XHTML just about everything needs to be in lowercase unless it is specifically required to be uppercase, so try:


<style type="text/css">
body {
margin : 0;
background-color : #f6f9f0;
}
</style>