I know this has been posted here before, but the solutions specific to one poster didn't work for me ::sigh:: I'm working on building my site and having a coding problem. The address is: http://www.alexbenothman.com/weddings.html There are two problems: 1) The background image isn't showing up. It should be repeating on both the x and y axis. I tried background-repeat: repeat-x repeat-y; and that didn't work. It was showing up for awhile but it disappeared now, and when I validated it it said that repeat-x repeat-y was too much and so that's when I shortened it to just repeat. The code to background image is: body { background: url(background.jpg); background-repeat: repeat; font-family: "Arial", Helvetica, sans-serif; font-size: 1.0em; margin: 0; } The image is showing up fine in Safari but it's not showing up in Firefox. Can anyone help? The weird thing is, the image inside the content shows up fine: #content { background: url(contentbackground.jpg); background-repeat: repeat; padding: 0px 0px 0px 0px; } It's driving me nuts! If I need to provide more code, let me know and I'll gladly do so. 2) The other problem is at the bottom of the page. There's a large gap between the content and the end. It's showing through to the background, which it shouldn't. Third problem (but I feel if the first problem is solved the third will be too, somehow) the header on the main page (when you click home) isn't showing. But the first two are what are driving me the most nuts now.
try add images/ in background: url(images/background.jpg); this problem maybe your padding or margin to big. hope this will solve your prob
Thanks, but that image doesn't reside in an images folder. It resides on the main level. Thanks though! Hmm...not sure, maybe? If you go to the gallery (http://www.alexbenothman.com/stack001.html) you'll see where the problem really gets sticky. On the right side you can see the table is just popping outside of the borders. Yuck! I'm wondering if it's a container issue?
The url should be inside single quotes like this: url('http://........') your missing the quotes, also one mistake many make is that they leave out the # in their html when they pick a hex value for color, leaving out the # will make your color not show up in fox. just an extra note ... Also, sometimes one mistakes gives a domino effect. One mistakes sets out other issues that may be indirectly linked to that mistake...
do you have a clear code in your css file? try put this code in your css file .clear { clear : both; } PHP: and this code to your bottom page (after your picture gallery) if not ok, try put to other place. (try n error) <div class="clear"></div> PHP:
Mixing both shorthanded and specific settings for background is not recommended, as some browsers might pay undue attention to the shorthanded code and set defaults for any other unstated (or even stated) specific properties. So try a consistent approach - see if this makes a difference, after deleting the specific setting for repeat: background: url(background.jpg) repeat; Code (markup): Or alternately use specific settings only - background[color=blue]-image[/color]: url(background.jpg); background-repeat: repeat; Code (markup):
for body try background: url(background.jpg) left top repeat; Code (markup): for #content try background: url(filename) left top repeat; Code (markup): and please set width and height with display:block; for #content Cheers
Sorry it's taken so long to get back. I managed to fix the problem of the content overlapping (and ran into another issue but that got fixed), but the background is still now showing up. Here is the code: CSS Sheet 1 CSS Sheet 2
P.S. @forextrendalerts: I think you're definitely correct that it's a domino effect. None of the suggestions seemed to click so far. I'm also using firebug to see what works because it's Firefox specific anyways.
I think I figured out the problem. I didn't know what the -moz was that was popping up in Firebug, and hoped I could figure it out later, which I did! Whoo hoo! The reason it's not showing up in Firefox is because the -moz-background code is specific to Mozilla Firefox. Now all I have to do is figure out which code to use to fix it and I should be good. If anyone figures it out first, let me know!