Sent by Erik Harris on 2 November 2004 09:09
At 09:43 AM 11/1/2004, Zoe M. Gillenwater wrote:
>Chuck Harmston wrote:
>>I'm trying to set up a flexible-width layout with 50px margins on both
>>the right and left sides. In these margins I have images which I
>>would like to tile vertically along the page, but I am having trouble
>>getting both images to tile correctly in Gecko-based browsers without
>>additional whitespace.
>>
>>My initial idea was to onion skin the entire layout. Set the body
>>background to the left image, and set an enclosing div around the
>>entire layout with a 100% width, and tile the right-side background
>>inside of this. It looks good in IE, but there is extra whitespace in
>
>Can you send us a link to a page showing the problem? It's hard to say
>what the problem might be without seeing the markup and CSS.
I want precisely the same effect. Unfortunately, I ran into a fatal bug in
Gecko (which I still haven't gotten around to documenting well enough to
post a Bugzilla report) that prevents you from doing this the best way - by
specifying a background for HTML and a background for BODY. If they're
different backgrounds, Gecko chokes badly and maxes out the CPU's
usage. If they're the same background, Gecko actually doesn't mind.
The workaround I used, which works on any page that's long enough to create
a scrollbar (i.e. unlike what Chuck reported), can be seen on
<http://cimac.eharrishome.com> - Note the left and right background
pictures, without extraneous space on top. There's a _small_ amount of
whitespace on the bottom of the right background picture, but not enough to
really bother me, and many times, it falls between copies of the image and
is therefore totally unnoticeable. Feel free to poke around my CSS and
HTML code to see how it was done.
While you're there, check out the "Photos" page or the "Instructors"
page. I don't say this to try to publicize my club, but to point out the
shortcoming of this solution. If you're running at sufficiently high
resolution (1280x1024 does it when maximized; I'm running at 1600x1200 with
a non-maximized Firefox taking up about 90% of the screen space), the
Photos and Instructors pages don't have enough content to fill the
viewport. In this case, there's extra whitespace on the bottom of the
screen - but not on the top of the screen, as Chuck is complaining about.
I did _start_ to put together an example page for a bug report. If you
look at <http://cimac.eharrishome.com/GeckoBug-CIMAC.css> (case sensitive),
you'll see the CSS code that I was using when I accidentally caused Firefox
to crash and burn (people with Mozilla, Netscape, etc, all verified that it
did the same to them). I've made enough changes since then to both the CSS
and the HTML that I'm not totally sure that you can just plug the CSS into
the HTML I'm currently using - I need to do that to generate the bug
report. This problem CSS code also shows an ideal solution that would put
a background image on the whole viewport, on both sides of the screen, if
not for the fact that it brings Gecko to its knees (or at least it did when
I tried it, apparently in March of this year).
Hope this helps
Erik Harris [EMAIL-REMOVED]
AIM: KngFuJoe http://www.eharrishome.com/
Chinese-Indonesian MA Club http://cimac.eharrishome.com/
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
