MATTHEW BERNHARDT wrote: > What I'm aiming for is to have rounded corners on all 4 corners of each of > the items in a menu. This leads me to several apparent constraints: > > 1 - Because all 4 corners will need to be rounded, the sliding > doors[2]technique doesn't seem like it will work as that technique only > provides for 2 sides, not 4 corners. >
If the items are either fixed width or fixed height 2 images (or pieces of one image) will suffice. Otherwise I think you will need four. > 2 - As a menu, the markup I'm working with should ideally be a list. > I agree. > 3 - Another aspect of menus is that the typically don't have a lot of text to > use for hooks for CSS. > But assuming your menu will be a list of links, you already have two hooks - the <li> and the <a>. Wrap the text in a <span> and you're almost there. > 4 - This one has me pulling out what little hair remains - I'm up against a > self-imposed limit for the number of images on these pages, so I'm trying to > combine rounded corner images into 1 and then use clipping to select only the > corner I'm interested in. > I think one image is possible with CSS directing which bit should be displayed. Clip is an interesting proposition, however... > the gist of the HTML is (for one menu option) : > > <li class="item1"><img class="testul" alt="" src="clipround.gif" width="6" > height="6" /><img class="testur" alt="" src="clipround.gif" width="6" > height="6" /><img class="testll" alt="" src="clipround.gif" width="6" > height="6" /><img class="testlr" alt="" src="clipround.gif" width="6" > height="6" />Knowlton School</li> > IMO this is extremely unattractive and needlessly repetitive markup. I think presentational images (like the ones we're talking about) should really be shifted into the stylesheet as backgrounds. Then you can use background-position to dictate which part of the image is seen. I think this is the basis of the sliding doors technique, no need for clipping. The list gurus will be better able to help with the nuts and bolts, but this is my two cents. Of course you could try something like http://www.html.it/articoli/nifty/index.html (nifty corners) which uses javascript and the DOM to achieve pretty much the same thing. Cheers, D# ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7 information -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
