Hello Everyone,
I am using some basic CSS to set the background colour of a web page. I have used the 'background-color' property many times successfully. However this time the page is ignoring the specific colour that I would like displayed, and instead is simply displaying in white!
The code is listed below, if you have any suggestions concerning how to get the page background colour to behave itself they will be highly appreciated.
<html>
<head>
<title>My Fern Gully Stamps</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
//<!--
body
{
background-color:#ff00ff;
}
.button_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
.example_heading
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
}
.info_text
{
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
.inner_table
{
background-color: #ffff6c;
}
.larger_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.largest_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
.outer_table
{
background-color:#C0BD60;
}
.smaller_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
.smallest_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}
.standard_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
#page_block
{
position:absolute;
}
//-->
</style>
<script type="text/javascript" src=http://www.webdeveloper.com/forum/archive/index.php/"positioner.js"></script>
<script type="text/javascript" src=http://www.webdeveloper.com/forum/archive/index.php/"doiMenuDOM.js"></script>
<script type="text/javascript">
var fgsMenu = new TMainMenu('fgsMenu','vertical');
var homeMastMenu = new TPopMenu('Home','0','','','Ferngully Stamps Home Page');
var homeStudMenu = new TPopMenu('Fern Gully Home Page','0','a','http://www.google.com','Ferngully Stamps Home Page');
var myFernMenu = new TPopMenu('My Fern Gully','0','','','My Fern Gully Preferences');
var myPrefMenu = new TPopMenu('My Site Preferences','0','','','Customize the way Fern Gully Stamps looks online');
var surveyMenu = new TPopMenu('Craft Stamps Survey','0','','','Take our easy craft stamps survey!');
var companyMastMenu = new TPopMenu('Company Profile','0','','','Read about Fern Gully Stamps');
var companyStudMenu = new TPopMenu('About Fern Gully','0','','','Read about Fern Gully Stamps');
var browseMenu = new TPopMenu('Browse Craft Stamps','0','','','Look at our large range of craft stamp designs');
var cat1Menu = new TPopMenu('Catalogue 1','0','','','Look at Craft Stamps from catalogue one');
var cat2Menu = new TPopMenu('Catalogue 2','0','','','Look at Craft Stamps from catalogue two');
var cat3Menu = new TPopMenu('Catalogue 3','0','','','Look at Craft Stamps from catalogue three');
var cat4Menu = new TPopMenu('Catalogue 4','0','','','Look at Craft Stamps from catalogue four');
var cat5Menu = new TPopMenu('Catalogue 5','0','','','Look at Craft Stamps from catalogue five');
var businessMenu = new TPopMenu('Business Stamps','0','','','Business Stamps');
var selfMenu = new TPopMenu('Self Inkers','0','','','Self Inking Stamps');
var typeMenu = new TPopMenu('Type Sets','0','','','Investigate our range of type sets');
var scrapMenu = new TPopMenu('Scrapbooking','0','','','Scrapbooking Papers & Frames');
var framesMenu = new TPopMenu('Scrapbooking Frames','0','','','Look at our range of Scrapbooking Frames');
var papersMenu = new TPopMenu('Scrapbooking Papers','0','','','Look at our range of Scrapbooking Papers');
var formsMenu = new TPopMenu('Forms','0','','','Printable order forms');
var businessFormMenu = new TPopMenu('Business Stamps Order Form','0','','','Printable copy of our business stamps order form');
var craftFormMenu = new TPopMenu('Craft Stamps Order Form','0','','','Printable copy of our craft stamps order form');
var comingEventsMastMenu = new TPopMenu('Coming Events','0','','','Fern Gully Stamps news and upcoming events');
var comingEventsStudMenu = new TPopMenu('News and Events','0','','','Fern Gully Stamps news and upcoming events');
fgsMenu.Add(homeMastMenu);
homeMastMenu.Add(homeStudMenu);
fgsMenu.Add(myFernMenu);
myFernMenu.Add(myPrefMenu);
myFernMenu.Add(surveyMenu);
fgsMenu.Add(companyMastMenu);
companyMastMenu.Add(companyStudMenu);
fgsMenu.Add(browseMenu);
browseMenu.Add(cat1Menu);
browseMenu.Add(cat2Menu);
browseMenu.Add(cat3Menu);
browseMenu.Add(cat4Menu);
browseMenu.Add(cat5Menu);
fgsMenu.Add(businessMenu);
businessMenu.Add(selfMenu);
businessMenu.Add(typeMenu);
fgsMenu.Add(scrapMenu);
scrapMenu.Add(framesMenu);
scrapMenu.Add(papersMenu);
fgsMenu.Add(formsMenu);
formsMenu.Add(businessFormMenu);
formsMenu.Add(craftFormMenu);
fgsMenu.Add(comingEventsMastMenu);
comingEventsMastMenu.Add(comingEventsStudMenu);
</script>
</head>
<body onresize="window.location.href = <!-- m --><a class="postlink" href="http://www.webdeveloper.com/forum/archive/index.php/window.location.href;">http://www.webdeveloper.com/forum/archi ... tion.href;</a><!-- m -->">
....
Thanks for your assistance
Regards
Davo// has no place between some style tags:<style type="text/css"><!--
/* Your CSS here. */
--></style>
<script type="text/javascript"><!--
// Your JavaScript here.
//--></script>David,
Thanks for your help on this one. I had a feeling that it was something silly, you have helped me out heaps, I had blinders on. Thanks again.
Regards
DavoHappy to help.
Also be aware that there is a known issue with IE 5.5 and the CSS background color property.Also be aware that there is a known issue with IE 5.5 and the CSS background color property.What issue is that? 
It ignores it, at least in embedded sheets. I believe it's 5.5 but I know one of the IE 5's do because I ran into the problem personally.Try changing:
body
{
background-color: #ff00ff;
}
to
body
{
background: #ff00ff;
}Hey,
Thanks for your suggestion. As it turn out I was commenting the document incorrectly, I was getting my javascript and css comments mixed up. As another forum member kindly pointed out:
<style type="text/css>
<!--
body
{
background-color:#ff00ff;
}
-->
</style>
<script type="text/javascript">
//<!--
document.write("I will not forget my commenting methods!");
//-->
</script>
I will also keep your suggestion in mind, and experiment with the two alternative techniques. Thanks again for your assistance.
Regards
DavoNo need for the //<!-- in the <script> tags, JavaScript recognises <!-- as a one line comment, just like //.Thanks for the handy pointer, really appreciate it. I had no idea that comments behaved in that fashion when writing javascript, legendary, thanks again.
Regards
DavoHappy to help.
I am using some basic CSS to set the background colour of a web page. I have used the 'background-color' property many times successfully. However this time the page is ignoring the specific colour that I would like displayed, and instead is simply displaying in white!
The code is listed below, if you have any suggestions concerning how to get the page background colour to behave itself they will be highly appreciated.
<html>
<head>
<title>My Fern Gully Stamps</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
//<!--
body
{
background-color:#ff00ff;
}
.button_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
.example_heading
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
}
.info_text
{
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
.inner_table
{
background-color: #ffff6c;
}
.larger_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 16px;
}
.largest_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
}
.outer_table
{
background-color:#C0BD60;
}
.smaller_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
}
.smallest_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
}
.standard_text
{
color:#400000;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
}
#page_block
{
position:absolute;
}
//-->
</style>
<script type="text/javascript" src=http://www.webdeveloper.com/forum/archive/index.php/"positioner.js"></script>
<script type="text/javascript" src=http://www.webdeveloper.com/forum/archive/index.php/"doiMenuDOM.js"></script>
<script type="text/javascript">
var fgsMenu = new TMainMenu('fgsMenu','vertical');
var homeMastMenu = new TPopMenu('Home','0','','','Ferngully Stamps Home Page');
var homeStudMenu = new TPopMenu('Fern Gully Home Page','0','a','http://www.google.com','Ferngully Stamps Home Page');
var myFernMenu = new TPopMenu('My Fern Gully','0','','','My Fern Gully Preferences');
var myPrefMenu = new TPopMenu('My Site Preferences','0','','','Customize the way Fern Gully Stamps looks online');
var surveyMenu = new TPopMenu('Craft Stamps Survey','0','','','Take our easy craft stamps survey!');
var companyMastMenu = new TPopMenu('Company Profile','0','','','Read about Fern Gully Stamps');
var companyStudMenu = new TPopMenu('About Fern Gully','0','','','Read about Fern Gully Stamps');
var browseMenu = new TPopMenu('Browse Craft Stamps','0','','','Look at our large range of craft stamp designs');
var cat1Menu = new TPopMenu('Catalogue 1','0','','','Look at Craft Stamps from catalogue one');
var cat2Menu = new TPopMenu('Catalogue 2','0','','','Look at Craft Stamps from catalogue two');
var cat3Menu = new TPopMenu('Catalogue 3','0','','','Look at Craft Stamps from catalogue three');
var cat4Menu = new TPopMenu('Catalogue 4','0','','','Look at Craft Stamps from catalogue four');
var cat5Menu = new TPopMenu('Catalogue 5','0','','','Look at Craft Stamps from catalogue five');
var businessMenu = new TPopMenu('Business Stamps','0','','','Business Stamps');
var selfMenu = new TPopMenu('Self Inkers','0','','','Self Inking Stamps');
var typeMenu = new TPopMenu('Type Sets','0','','','Investigate our range of type sets');
var scrapMenu = new TPopMenu('Scrapbooking','0','','','Scrapbooking Papers & Frames');
var framesMenu = new TPopMenu('Scrapbooking Frames','0','','','Look at our range of Scrapbooking Frames');
var papersMenu = new TPopMenu('Scrapbooking Papers','0','','','Look at our range of Scrapbooking Papers');
var formsMenu = new TPopMenu('Forms','0','','','Printable order forms');
var businessFormMenu = new TPopMenu('Business Stamps Order Form','0','','','Printable copy of our business stamps order form');
var craftFormMenu = new TPopMenu('Craft Stamps Order Form','0','','','Printable copy of our craft stamps order form');
var comingEventsMastMenu = new TPopMenu('Coming Events','0','','','Fern Gully Stamps news and upcoming events');
var comingEventsStudMenu = new TPopMenu('News and Events','0','','','Fern Gully Stamps news and upcoming events');
fgsMenu.Add(homeMastMenu);
homeMastMenu.Add(homeStudMenu);
fgsMenu.Add(myFernMenu);
myFernMenu.Add(myPrefMenu);
myFernMenu.Add(surveyMenu);
fgsMenu.Add(companyMastMenu);
companyMastMenu.Add(companyStudMenu);
fgsMenu.Add(browseMenu);
browseMenu.Add(cat1Menu);
browseMenu.Add(cat2Menu);
browseMenu.Add(cat3Menu);
browseMenu.Add(cat4Menu);
browseMenu.Add(cat5Menu);
fgsMenu.Add(businessMenu);
businessMenu.Add(selfMenu);
businessMenu.Add(typeMenu);
fgsMenu.Add(scrapMenu);
scrapMenu.Add(framesMenu);
scrapMenu.Add(papersMenu);
fgsMenu.Add(formsMenu);
formsMenu.Add(businessFormMenu);
formsMenu.Add(craftFormMenu);
fgsMenu.Add(comingEventsMastMenu);
comingEventsMastMenu.Add(comingEventsStudMenu);
</script>
</head>
<body onresize="window.location.href = <!-- m --><a class="postlink" href="http://www.webdeveloper.com/forum/archive/index.php/window.location.href;">http://www.webdeveloper.com/forum/archi ... tion.href;</a><!-- m -->">
....
Thanks for your assistance
Regards
Davo// has no place between some style tags:<style type="text/css"><!--
/* Your CSS here. */
--></style>
<script type="text/javascript"><!--
// Your JavaScript here.
//--></script>David,
Thanks for your help on this one. I had a feeling that it was something silly, you have helped me out heaps, I had blinders on. Thanks again.
Regards
DavoHappy to help.
Also be aware that there is a known issue with IE 5.5 and the CSS background color property.Also be aware that there is a known issue with IE 5.5 and the CSS background color property.What issue is that? It ignores it, at least in embedded sheets. I believe it's 5.5 but I know one of the IE 5's do because I ran into the problem personally.Try changing:body
{
background-color: #ff00ff;
}
to
body
{
background: #ff00ff;
}Hey,
Thanks for your suggestion. As it turn out I was commenting the document incorrectly, I was getting my javascript and css comments mixed up. As another forum member kindly pointed out:
<style type="text/css>
<!--
body
{
background-color:#ff00ff;
}
-->
</style>
<script type="text/javascript">
//<!--
document.write("I will not forget my commenting methods!
");//-->
</script>
I will also keep your suggestion in mind, and experiment with the two alternative techniques. Thanks again for your assistance.
Regards
DavoNo need for the //<!-- in the <script> tags, JavaScript recognises <!-- as a one line comment, just like //.Thanks for the handy pointer, really appreciate it. I had no idea that comments behaved in that fashion when writing javascript, legendary, thanks again.
Regards
DavoHappy to help.