Rich, On Jan 11, 2006, at 9:04 AM, Richard Brown wrote:
>>> I have a couple of images on this site: >>> <http://www.uzellacourtantiques.co.uk/> > >>> The second image is the one that sits in the nav bar at the bottom. >>> Rather than sit alongside the text, I would like it to sit on top. >>> How >>> do I do this please? >> >> set the images display to block. > I tried to implement this and ended up with the code in the css. The > only thing I have found is that the nav bar does not sit central and > with fixed width the links end up being tiny. Could someone tell me > how to get the bar to centre please? First, I'd suggest that you put the image inside the a element so the whole thing is clickable. Second, think about specifying the width of the li in ems so it can scale with the users font-size. Third, this solution only works if the number of menu items is constant and known beforehand. .listcontainer ul, .listcontainer li { list-style-type: none; } .listcontainer ul { margin: 0 auto; padding: 0; width: 36em; /* num of items * 3.6 (width+margin) */ min-width: 575px; /* items * 45px + slop for margins */ } .listcontainer li { float: left; width: 3em; /* arbitrary change at will as long as you recalc the others :-) */ min-width: 45px; /* keep li from getting narrower than the img */ margin: 0 .3em; padding: 0; } .listcontainer li a { display: block; font-size: 0.9em; } .listcontainer li img { display: block; width: 45px; margin: 0 auto; } Some ie/win bug fixing may be necessary. hth -- Roger Roelofs "Remember, if you’re headed in the wrong direction, God allows U-turns!" ~Allison Gappa Bottke ______________________________________________________________________ css-discuss [EMAIL PROTECTED] 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/
