By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,445 Members | 1,160 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,445 IT Pros & Developers. It's quick & easy.

Right-floated image height

P: n/a
A perennial problem; apologies if people are sick of this one. I have a
dynamic-width page with stripes on the left and the right; the left
stripe is defined in "body {background:}", while the right stripe is in a
right-floated div.

Has anyone come up with a method to make a right-floated image run the
full height of the document? Both Mozilla and IE(5, probably 6) take
"height: 100%" to mean "100% of the viewport height". Scroll down, and
the stripe just ends there in the middle of the document.

I'm to the point of defining "height: 250%" and such, but that can make
for a heckuva lot of white space at the bottom, depending on font size,
window size, and the phase of the moon. Any better ideas?

Have a look:
http://www.foogod.com/~torquill/test...index_new.html
stylesheet at ./index_import.css (Warning: kludge zone still in effect!)

I can't decide whether this or the "background: fixed" bug costs me more
hair. Thank heavens I'm not trying to do both....

--Alison
Jul 20 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
On Fri, 17 Oct 2003 06:41:45 GMT, "Alison Stewart"
<sp*********@foogod.com> wrote:
A perennial problem; apologies if people are sick of this one. I have a
dynamic-width page with stripes on the left and the right; the left
stripe is defined in "body {background:}", while the right stripe is in a
right-floated div.

Has anyone come up with a method to make a right-floated image run the
full height of the document? Both Mozilla and IE(5, probably 6) take
"height: 100%" to mean "100% of the viewport height". Scroll down, and
the stripe just ends there in the middle of the document.

I'm to the point of defining "height: 250%" and such, but that can make
for a heckuva lot of white space at the bottom, depending on font size,
window size, and the phase of the moon.
Too true.
Any better ideas?


Yes, I think so. This does indeed get asked from time to time, so I've
borrowed your stripes to knock up a quick demo:

http://www.xs4all.nl/~sbpoley/webmatters/layout5.html

It uses nested DIVs rather than floats.

HTH

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/
Jul 20 '05 #2

P: n/a
On Fri, 17 Oct 2003 17:53:27 +0200, Stephen Poley
<sb******************@xs4all.nl> wrote:
Yes, I think so. This does indeed get asked from time to time, so I've
borrowed your stripes to knock up a quick demo:

http://www.xs4all.nl/~sbpoley/webmatters/layout5.html

It uses nested DIVs rather than floats.


Exactly what I was looking for -- thanks, Stephen. I had to mess with the
right margin a little, but it's perfect now.

Thanks for the reply.

Alison
------
http://www.painters-wing.com
Jul 20 '05 #3

P: n/a
On Sat, 18 Oct 2003 00:54:43 GMT, "Alison Stewart"
<sp*********@foogod.com> wrote:
On Fri, 17 Oct 2003 17:53:27 +0200, Stephen Poley
<sb******************@xs4all.nl> wrote:
Yes, I think so. This does indeed get asked from time to time, so I've
borrowed your stripes to knock up a quick demo:

http://www.xs4all.nl/~sbpoley/webmatters/layout5.html

It uses nested DIVs rather than floats.
Exactly what I was looking for -- thanks, Stephen. I had to mess with the
right margin a little, but it's perfect now.
I forgot to mention that I noticed your stripes_right wasn't quite a
mirror-image of your stripes_left, so I produced a new version by
flipping stripes_left. That would cause the margin difference.
Thanks for the reply.


You're welcome.

--
Stephen Poley

http://www.xs4all.nl/~sbpoley/webmatters/
Jul 20 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.