Background CSS colour or image are not showing up in any browser

Background CSS image and color problem

[TonyMet]

Hi,

If anyone can help it would be greatly appreciated. I've already looked around the net and tried so many different things, but I still can't figure out why the background CSS colour or image are not showing up in any browser? I know there can be certain problems with some browsers not showing properly, but i think this is a wider problem. I have checked it in Firefox, Safari and Google Chrome.

Here is the code from the CSS file

#body{
margin: 0;
padding: 5px 0;
background-color: #336699
background-image: url(http://www.boatsbuildingplans.com/wp-content/themes/NicheProfitPressV2/images/seabackground.jpg)
background-repeat: fixed center no-repeat;
font: normal 14px Arial, Helvetica, sans-serif;
color: #333;

Links to things I think you might need to look at are:

The main website address is located @

[boatsbuildingplans.com...]

The CSS file is located @

[boatsbuildingplans.com...]

The background image is located @

[boatsbuildingplans.com...]

I think that about cover it all, but please let me know if there is anything else you might need.

Thanks in advance,

Tony

[Major_Payne]

Missing the semicolon after background-color: #336699 and the colosing "}" unless that was a typo. Better:

#body{
margin: 0 auto; /* centers page */
padding: 5px 0;
background: #336699 url(http://www.boatsbuildingplans.com/wp-content/themes/NicheProfitPressV2/images/seabackground.jpg) no-repeat center fixed; 
font: normal 14px Arial, Helvetica, sans-serif;
color: #333;
}

If the seabackground.jpg image is on your site, you could use a relative path to it.

[birdbrain]

Hi there TonyMet,

our friend Major_Payne has given you the cure but you must remove the
highlighted snippets to make your background-image/color appear. ;)

magei/*  
 Theme Name: Niche Profit Press V2 
 Theme URI: [NicheProfitClassroom.com...]  
 Description: Proprietary theme for Niche Profit Classroom. 
 Version: 2.0 
 Author: NicheProfitClassroom.com 
 Author URI: [NicheProfitClassroom.com...]  
*/ 

#body{ 
 margin: 0; 
 padding: 5px 0; 
 background: #336699 url("../images/seabackground.jpg") fixed center no-repeat; 
 font: normal 14px Arial, Helvetica, sans-serif; 
 color: #333; 
 } 

birdbrain

[Major_Payne]

Oops. I did miss that "#body" one. Glad there are sharper eyes on this forum than mine. :P

[birdbrain]

Hi there Major_Payne,

Glad there are sharper eyes on this forum than mine

The errors were not visually discovered. :(
That is not my Modus Operandi. ;)

I just test code with the "Firefox Web Developer 1.1.8 add-on" and the "W3C validators".:)

birdbrain

[Major_Payne]

I just test code with the "Firefox Web Developer 1.1.8 add-on" and the "W3C validators"

I have the same tool and always validate, but I just looked at the code the OP posted at the beginning as there was no need to test. Quicker to read it, but I did miss that part. :P

[TonyMet]

Hi guys,

Thanks for the replies.

The good news is that I've now managed to get it working. I posted the problem in a few forums and tried all the suggestions, but nothing seemed to be working.

Then I deleted the site a reuploaded it and tried again. It was still being weird. The background colour was showing, but as soon as i tried with the image, it lost the colour too for some reason.

I'm not even sure what i did in the end to get it working, but at least it is!

Cheers again for you help

Tony

P.S. One quick question, the footer on the homepage is displaying weirdly outside of the white box. Any ideas why this is happening?

[Major_Payne]

Footer may have a CSS style causing it or the CSS for container before it. Either way, you have this back to back:

<br style="clear: both;" clear="&lt;br"> 
  </div>

 <br style="clear: both;" clear="all">
 <div id="footer">

This makes no sense: "clear="<br""

Might want to validate your pages:

CSS errors [jigsaw.w3.org]

HTML errors [validator.w3.org]