I am working through the Sitepoint book - Build your own website the right way - and am really enjoying it. The main problem I am having is that even when I write up the xhtml code and the css stylesheets exactly as they are in the book, when I try to preview the webpages in a browser (Internet Explorer) none of the font color changes, background colour changes, images or shading shows up. Everything is black and white, with the exception of the links. I think that the CSS stylesheet is linked correctly because because font types and borders that I have included do change. Any ideas why the other items don’t show? Could it be something to do with the configuration of my browser? Sorry, I’m sure this is a very stupid question but I searched the forums and couldn’t see it asked before (probably because it’s a very stupid question!!!), Any help would be greatly appreciated.
Welcome to Sitepoint. 
Can you post the code you have? Then we can look at it and see if there are any issues there.
Welcome to SitePoint, Breninio!
Can you show us your code?
Sorry, Ben, we cross-posted!
Thank you very much for your responses. I have set out below the xhtml code and the css style sheet that I have taken pretty much straight from the book. When I open the page in my browser all the font is black and the background is white. Thanks again for taking the time to try and help.
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=“http://www.w3.org/1999/xhtml”>
<head>
<title>Bubble Under - The diving club for the south-west UK</title>
<meta http-equiv=“Content-Type” content=“text/html; charset=utf-8”/>
<link href=“style1.css” rel=“stylesheet” type=“text/css” />
</head>
<body>
<div id=“header”>
<div id=sitebranding">
<h1>BubbleUnder.com</h1>
</div>
<div id=“tagline”>
<p>Diving Club for the South West UK - Let’s make a splash!</p>
</div>
</div> <!–end of header div–>
<div id=“navigation”>
<ul>
<li><a href=“index.html”>Home</a></li>
<li><a href=“about.html”>About Us</a></li>
<li><a href=“Contact.html”>Contact Us</a></li>
</ul>
</div> <!–end of navigation div–>
<div id=“bodycontent”>
<h2>Welcome to our Super-dooper Scuba site</h2>
<p>Glad you could drop in and share some air with us! You’ve passed your unerwater navigation skills
and successfully found your way to the start point</p>
</div> <!–end of bodycontent div–>
</body>
</html>
/*
CSS for BubbleUnder.com site
*/
body {
font-family: Verdana; Helvetica, Arial, sans-serif;
background-colour: #e2edff;
line-height: 125%;
padding: 15px;
border: 4px solid navy;
}
h1 {
font-family: “Trebuchet MS”, Arial, Helvetica, sans-serif;
background colour: blue;
font-size: x-large;
}
li {
font-size: small;
}
h2 {
colour: blue;
font-size: medium;
font-weight: normal;
}
p {
font-size: small;
colour:red;
}
Can you spell the word color as colour and have it work? Try taking the u out of colour and see if that helps.
Jeannie
Yes, jeannieg got it bang on the money… the reason your code doesn’t work is simply because you spelt color (the US English version) as colour (the European / UK way). Unfortunately (and as grammatically annoying as it may be), you are required to format all of your code in US English as that’s what the language was written in, thereby using different spellings will not be recognised by the web browser. A common issue for first time designers.
Yes, yes, yes that’s it!!! That was driving me nuts trying to figure it out. Thanks so much for all your help.