[thelist] CSS image position

Kevin W null at tsn.cc
Mon Jan 20 00:27:01 CST 2003


> I have a right <TD> and want to position corner images at the top and
> bottom of
> the <TD> but it is only possible to have one backround image with the
> same class:

Try this HTML:
<td>
<div><div><div><div>
Lorem ipsum dolor sit amet...
</div></div></div></div>
</td>

With CSS:
td.rightfill div {
 background: transparent url(../images/ltcorner.gif no-repeat fixed top
left);}
td.rightfill div div {
 background: transparent url(../images/rtcorner.gif no-repeat fixed top
right);}
td.rightfill div div div {
 background: transparent url(../images/rbcorner.gif no-repeat fixed bottom
right);}
td.rightfill div div div div {
 background: transparent url(../images/lbcorner.gif no-repeat fixed bottom
left);}

Are you sure you want background-attachment: fixed?  That will make it
fixed to the viewport, which means when you scroll, the images won't move
down with the rest of the document.  Even worse, they will be in the
corners of the *screen*, not the td.

--
Kevin W :-)



More information about the thelist mailing list