HTMLHelp Forums > HTML issue with web pages only shows up in Safari

Chantal

Apr 27 2012, 08:20 PM

Hello! I am new to the group and very happy to have found you! I have used this forum for reference on other issues but I seem to need to come out of lurking mode for help on this one!!

I designed a site for a friend:

http://www.demfamilyarts.com/devzone/calendar.htm

This works fine in Firefox, Chrome and even IE (!!) but I hit a snag in Safari... for some reason my background image will not extend to the length of the page, it shows at the top but stops and gives me this big ugly white background instead.

Can you tell me what I am doing wrong? Anyone else had this problem before?

Thanks a bunch!
Chantal

Darin McGrew

Apr 28 2012, 12:27 AM

In what version of Safari? I didn't notice anything obviously different in Firefox, Chrome, Safari, or Opera (on MacOS).

The online tools do report markup and CSS errors though:
http://validator.w3.org/check?uri=http%3A%...ine&group=0
http://jigsaw.w3.org/css-validator/validat...ng=&lang=en

pandy

Apr 28 2012, 01:54 AM

It looks the same in all browsers I tried also, the background doesn't go all the way down. That's because the image isn't higher than that and you have stopped it from tiling vertically.

CODE

body {
    margin: 0;
    padding: 0;
    background: url(../images/box/bg2.png) repeat-x fixed;
    font-family: Arial, Helvetica, sans-serif;
}

Chantal

Apr 29 2012, 08:09 AM

The latest installed with new tech, 5.1.4 Others with older Macs do not have the same problem, it only showed up with people who have iPad 3 and iMac...

Weird!!

Thanks for the links, I'll fix up those errors!!

QUOTE(Chantal @ Apr 27 2012, 09:20 PM)

Hello! I am new to the group and very happy to have found you! I have used this forum for reference on other issues but I seem to need to come out of lurking mode for help on this one!!

I designed a site for a friend:

http://www.demfamilyarts.com/devzone/calendar.htm

This works fine in Firefox, Chrome and even IE (!!) but I hit a snag in Safari... for some reason my background image will not extend to the length of the page, it shows at the top but stops and gives me this big ugly white background instead.

Can you tell me what I am doing wrong? Anyone else had this problem before?

Thanks a bunch!
Chantal

Chantal

Apr 29 2012, 08:23 AM

I fixed it for now by making the background picture longer (1600px). If you have another trick for fixing it, let me know! I tried removing the "fixed" but it did not help with Safari.

Thanks!

QUOTE(pandy @ Apr 28 2012, 02:54 AM)

It looks the same in all browsers I tried also, the background doesn't go all the way down. That's because the image isn't higher than that and you have stopped it from tiling vertically.

CODE

body {
    margin: 0;
    padding: 0;
    background: url(../images/box/bg2.png) repeat-x fixed;
    font-family: Arial, Helvetica, sans-serif;
}

pandy

Apr 29 2012, 10:12 AM

It's 'repeat-x 'that makes it tile only in one direction.

Chantal

Apr 29 2012, 03:46 PM

oh wow!! OK, I should have known this... Thanks for your help!

QUOTE(pandy @ Apr 29 2012, 11:12 AM)

It's 'repeat-x 'that makes it tile only in one direction.

pandy

Apr 29 2012, 04:52 PM

Well, don't use things you don't know what they do... And you're welcome.

Chantal

Apr 30 2012, 07:50 PM

ohhh what fun is that?!?!

Thanks!!

QUOTE(pandy @ Apr 29 2012, 05:52 PM)

Well, don't use things you don't know what they do... And you're welcome.