Sigurd Magnusson wrote: > Well if you put a border on the span you see that the image is in the > wrong place within the span; > > Doing "background-position: bottom right;" within the "ul#subnav li.last > span {" certainly gets you most the way there; had you done that?
No! I hadn't thought it necessay because the span was given a width and height the same size as the background image. Your suggestion does help. It's still not quite right, but getting closer :)
Thanks!
Bert Doorn wrote:
http://cpanz.signify.co.nz/test/national-pod-template.html
I have an unordered list being used for navigation. The bottom item on the list needs to have a rounded corner. I figure:
Any ideas? I've spent way too long trying to figure this out, so no doubt have missed something basic!
Why not just make a background image for the last li instead of fiddling with spans, absolute and relative positioning etc?
ul#subnav li.last { background: #url(subnav-corner.gif) no-repeat right bottom; }
If that (as I suspect) interferes with the links (corner disappears, particularly on hover), put a background image on
li.last a ...and... li.last a:hover
I had thought of that, but the li.last a:hover does interfere with the corner:
http://cpanz.signify.co.nz/test/national-pod-template2.html
I can't put the corner as a background image on the <a> as you suggest as it already has the little box with the arrow as a background image. And I can't combime that with the bottom right corner as I don't know how "high" the link will be - eg whether it's 1 or 2 lines.
Incidentally, you might ass more contrast - there's not enough of it, especially on hover, making the (tiny) link text very hard to read.
Agreed, but I didn't design it, am "just" building it!
Thanks.
Mike
****************************************************** The discussion list for http://webstandardsgroup.org/
See http://webstandardsgroup.org/mail/guidelines.cfm for some hints on posting to the list & getting help ******************************************************
