Sent by Brian Lowe on 22 March 2005 16:04
Thanks to help from Martin Heiden about using a border on the UL element,
I've managed to resolve my issue.
Here's the solution:
ul {
margin-left: 5px;
padding-left: -10px;
list-style: none;
background: url(demo0008/ul-bg.gif) 0 0 repeat-y;
}
ul li {
padding-left: 20px;
background: url(demo0008/li-bg.gif) 0 0 no-repeat;
}
ul li:last-child, ul li.last-child {
background: url(demo0008/li-last-bg.gif) 0 0 no-repeat; }
The UL has a tiled background image providing the vertical line for that UL
group.
Each LI has its own background image overlaid on the UL background, giving
the joint line.
The last LI has a background image overlaid on the UL background, giving the
corner. This image extends far below the end of the list, hiding the
remainder of the UL vertical line for that group.
If you're interested you can see the working solution at
http://www.ajpi.co.uk/cssproblemsolution.htm
Brian Lowe
---------@
______________________________________________________________________
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/
