Background Image not displaying

Hi, I’m unsure how to fix this issue, I’ve searched the forums but can’t find a solution. I’ve tried a number of things.

You can view website: http://www.greensherbetcreative.com/index-test-2.html to test.

My background image is only loading when I view the CSS in edit mode on Mozilla Fire-fox, so I know it’s picking up the file, however I must be doing something else incorrectly.

There is a lot of CSS code - I’m yet to tidy - so the code specific to this is:

#main {
background-image:url(images/woman-with-megaphone-lrg.jpg);
background-color:#f4f0e9;
-moz-border-radius: 20px 20px 20px;
border-radius: 20px 20px 20px 20px;
box-shadow: 5px 5px 10px gray;
overflow: auto;
text-align: left;
behavior: url(pie.htc);
}

Thanks - I appreciate any help.

http://www.greensherbetcreative.com/css/images/woman-with-megaphone-lrg.jpg

404 here.

http://www.greensherbetcreative.com/images/woman-with-megaphone-lrg.jpg

Is probably what you wanted to link to. Paths from CSS files are relative to the location of the CSS, NOT the HTML… that’s why usually I don’t put the common css into a subdirectory, and if I do the images called by the css go in css/images instead of /images… which can be handy anyways for separating presentational images out from content ones.

That said, you’ve got a disastrously broken layout here from all the dynamic fonts inside PX metric containers. I’m a large fonts/120dpi user – the type of person %/em fonts are for; but because you’ve got so many fixed widths declared in PX pretty much everything is broken to the point of stuff looking ‘slapped on the page any old way’… like are those near-invisible menu items supposed to be on the dark bar background? If so why isn’t that bar on the menu instead of a separate element?

Of course with the HTML 5 for nothing and stupid javascript shiv nonsense it’s a miracle the page works at all – you might want to do yourself a favor and go back to the actually useful HTML 4 instead of jumping the gun on something not ready for prime-time, and go “oh well” on silly effects like shadows and rounded corners not showing up in legacy IE… especially since those shiv tend to cause more problems than they solve – Especially CSS3 PIE.

– edit – here’s a screencap to show you what I mean by broken.
http://www.cutcodedown.com/for_others/becstar95/broken.png

Thanks for your help - problem solved.

Of course I should have said ‘by the way I’m not a web developer - just someone trying their best to put together a website for myself!’

I’m definitely not trying to abuse heading tags for the purposes of SEO or just slapping anything together…this is a huge learning curve for me but…thanks for your feedback, I’ve read in-between your lines of thought and will take what you’ve advised into consideration.