Pretty basic problem, but it's driving me crazy. I've got a header, followed by a nav menu. I want a background image for my header but it will not display. I do not get errors on my CSS according to WebDeveloper, but the image will not display!
Did you assign a width and height to the div? Without a height, it won't show. Some ways to debug it:
- Browse in FireFox with FireBug installed. Right-click the element and hover over the background selector on the right. If you get that spinning "loading" graphic and no image preview, it's a path problem as mentioned.
- Add a border to the offending element any time you get in trouble. If you don't have a height, the div will appear as a single solid line.
- When deployed on a sever, do not use toothpick syndrome syntax. You may need to do this locally but when you do this
instead of this
it means "wherever you are, start at domain root and follow this path." So your CSS can be anywhere . . .
and it will always find it if you use a leading slash in image/object/href references.