iPad CSS problem - missing background image

[Artifice]

I have an issue with the way that my main web site Background image is displayed on an iPad. Basically, it doesn't even show!!

The page in question is:

http://www.artifice-design.co.uk/index.html

I am using 2 style sheets for this page, one for normal, desktop devices/browsers and one for iphone/ipad.

To achieve this I am using the following:

<link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" rel="stylesheet" />

<link rel="stylesheet" media="screen and (min-device-width: 481px) href="style.css" type="text/css" rel="stylesheet" />

<meta name="viewport" content="width = 1050" />

I have 2 versions of my background image, a massive one linked from my style.css file, for most people, and a smaller cropped version for the iphone.css file.

Now, this works fantastically well on the iphone but when I view on an iPad the background image just isn't visible at all.

Any ideas or workarounds?

Thanks,
Artifice

 

[BillyRayPreachersSon]

Does your iphone.css file validate? I see a missing closing brace for the body rule as a start, and that's only looking for 5 seconds without scanning the rest of the file...

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Snippets & Info:

http://www.codecouch.com/

The Out Atheism Campaign

 

[BillyRayPreachersSon]

Scrap that... I completely misread the file due to inconsistent indentation!

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:

http://www.codecouch.com/dan/

Code Couch Snippets & Info:

http://www.codecouch.com/

The Out Atheism Campaign