Jon Hughes wrote:
> 
> <div id="bottomlinks">
> <ul>
> <li>This</li>
> <li>That</li>
> <li>The other</li>
> </ul>
> </div>
> 

You have enough mark-up there for all the hooks you need. Start with the 
following style:

<div id="bottomlinks">
   <ul>
     <li class="first">This</li>
     ...
     <li class="last">The other</li>
   </ul>
</div>

And roughly these styles:

#bottomlinks {
   ... styles ...
   padding: 0;
   background: url(top-left.gif) no-repeat 0 0;
}

#bottomlinks ul {
   margin: 0;
   padding: 0;
   background: url(bottom-left.gif) no-repeat left bottom;
}

#bottomlinks .first {
   width: auto;
   background: url(top-right.gif) no-repeat right top;
}

#bottomlinks .last {
   width: auto;
   background: url(bottom-right.gif) no-repeat right bottom;
}

Your mileage may vary depending on how much restyling of the LIs you 
might have to do (bullet points etc.), but that's the basic premise.

______________________________________________________________________
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/

Reply via email to