I have a curious display quirk in FF3. It's fine in Safari, FF2, and IE etc. I
really don't know what is going on. I've googled my little heart out to no
avail.
On full page zoom, +2, the background image disappears. It is possible to
repeat the image on the x axis, but not the y or both. Explicitly declaring
all default background values does not help. If you only specify a colour, the
colour shows up, but once an image is specified, the background zooms to white
even if you specify a colour as well, both in shorthand and long style,
unless... Declaring repeat-x with an image and a colour shows the background
colour down the page and presumably theoretically repeats the image on the x
axis. Declaring repeat-y shows the background colour but does not repeat the
image on the y axis. Declaring repeat shows no colour or image.
Zooming text only does not trigger the same problem.
Declaring anything background related on the body {background-color:#333;
background-image: url(http://yuletidetreasure.org/yuletide_background.jpg;);
background-repeat:repeat} in the page head does show a colour but still does
not repeat the image and on page down it garbles everything, screencap follows:
http://skitch.com/sklim/np3jy/background-declared-on-body-page-head . (This
specific behaviour is so unexpected I'm inclined to think it's a problem with
my own computer; the other behaviours have shown on other machines.)
This *seems* to only happens on a page where the main cell contains some newer
definition lists, but the contents do not seem to be overflowing or overlapping
the sidebars and fiddling around with their widths and paddings etc has no
observable effect. Page address follows:
http://yuletidetreasure.org/unfilled2009.html
The css http://yuletidetreasure.org/style.css is:
body {
color: #ff;
font-family: verdana,arial,sans-serif;
font-size: 10pt;
margin: 0;
padding: 0;
background-image:
url('http://yuletidetreasure.org/yuletide_background.jpg');
}
and it's declared on the table as well:
table {
font-family: verdana,arial,sans-serif;
font-size: 10pt;
background-image:
url('http://yuletidetreasure.org/yuletide_background.jpg');
}
and the white cells have background colours declared:
td.mainpage {
background: #ff;
color: #00;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
padding-right: 10px;
margin: 0px;
}
table.form {
background: #ff;
color: #00;
padding-top: 10px;
padding-bottom: 10px;
padding-left: 10px;
margin: 0px;
}
table.unfilled {
background: #ff;
color: #00;
}
It's old (1997), so it's layout tables and no doctype. I learnt webdesign post
layout-tables; I've never ever used one, so I don't have any horse sense of how
to approach this problem. Can anyone steer me in the right direction?
Regards, Lim
(Excessively Defensive Postscript: Yes, whatever happens I will put a
background colour on the body. I appreciate the impulse but please do try to
refrain from lecturing me about the front end. Development is closed on this
project. The whole shebang is moving to a brand new flexible, accessible, open
source, fair trade, fat free, entirely woven from tofu, home later this year.
But in the meantime, they'd like the background image to show on a +2 full page
zoom in FF3!)
__
css-discuss [cs...@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/
