Hi

Your Css will be

#columnbottom {
        background: transparent url(../images/columnbottoms.gif) 0 -1px 
no-repeat;
        }
html>body #columnbottom {
        background: transparent url(../images/columnbottoms.gif) 0 -2px 
no-repeat;
        }

and your markup will be

<div id="columnbottom">&nbsp;</div>

bye ;)

-----Original Message-----
From: [EMAIL PROTECTED]
[mailto:[EMAIL PROTECTED] Behalf Of
[EMAIL PROTECTED]
Sent: Sunday, July 17, 2005 2:58 AM
To: [email protected]
Subject: [css-d] Unable to line up texture and image

I have ran into this tricky CSS design problem.  People who love
puzzles, will like this one.

My HTML:  http://webmarksonline.com/temp/coollines.htm
My CSS http://webmarksonline.com/temp/coollines.htm
My Problem: http://webmarksonline.com/temp/comp1.gif

I am using the CSS method that floats all three columns.  Because this
method produces uneven column lengths, I'm applying a vertically
repeating texture image (columntexture.gif) on my #column-wrapper div.
To make the column bottoms, I cleared the floats and added an image
(columnbottoms.gif) in the HTML.

With a bit of thought, you will realize that no matter how I slice my
columntexture.gif or my columnbottoms.gif, I will never be able to get
the two to line up properly in all cases of varying column heights.
Obviously, I would like my columns to grow and contract as needed based
on content.

Is there any solution?  Should I have used another CSS layout method
instead?  Should I try using table-layouts instead?

The another possibility might be to put in a Javascript hack that will
force the columns have heights of a fixed multiple.  But I am curious to
know how people would solve this problem in CSS.

Thanks,
Artcoder

______________________________________________________________________
css-discuss [EMAIL PROTECTED]
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/



______________________________________________________________________
css-discuss [EMAIL PROTECTED]
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/

Reply via email to