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"> </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/