Thanks for your detailed answer Philippe!
I don't have any Android based tablet either to test. On my iPad2,
the teal based background is not visible at all (the #wrapper div
nicely fills the viewport, which is to be expected given the meta
viewport declaration). A quick test case using your code works just
fine, however (the iPad is running iOS 6.1, I also checked in the iOS
simulator running iOS 5.1 and iOS 6.0).
That said, based on your description, I have the nagging feeling that
your device doesn't support 'background-attachment: fixed'. In that
case, the gradient will be as tall as the viewport (that is different
from the document height).
BTW does that happen with any browser on that device, or only with
the default browser ?
It happens in both the default browser and Chrome. I downloaded Dolphin
Browser but it crashed repeatedly, couldn't test it.
Workaround 2- add a background-color declaration, matching the end-point of
your
gradient, like this:
body { background: #649697; /* <-------- remove this Old browsers */
background: -moz-linear-gradient(top, #649697 16%, #234646 100%); /*
FF3.6+ */ /* … snip … / background: linear-gradient(to bottom,
#649697 16%,#234646 100%); /* W3C */ background-color: #234646; /*
<----------- add this - old browsers + fall back background-color */
background-attachment: fixed; background-repeat: no-repeat; }
Workaround #2 worked perfectly. Thank you so much!
--
Debbie
______________________________________________________________________
css-discuss [css-d@lists.css-discuss.org]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
