Rounded corners on unordered list

Question

I'd like to be able to have style my vertical menu, made with
an
unordered list, to have rounded corners. The menu is a fixed
width, but
the items could sometimes run onto two lines, so the height
of each item
needs to be flexible.
I created images called top.gif and bottom.gif for the curves
and when
I've done boxes I've made the bottom image a background to
the box div
tag and the top image a background to the heading tag within
the div.
However with the unordered list I don't really have two
elements to
attach the images to, if you understand what I mean?
I've been googling but haven't yet found a solution. Can
anyone
recommend a way of doing this?
Thanks
Vix

Answer 1

> I've been googling but haven't yet found a solution. Can
anyone recommend
> a way of doing this?
Could could wrap the UL in a DIV, giving you two elements.
You could give the first LI and last LI custom classes,
giving you to
elements.
While not pristine, I often will use wrapper divs to attach
CSS too:
<div id="menuOuterwrapper">
<div id="innnerWrapper">
<ul>...</ul>
</div></div>
That works for me in that it keeps my 'style HTML' separate
from my 'content
HTML'.
A goofy interpretation of 'separation of style and content',
perhaps.
-Darrel