At 10:31 AM 3/8/2006, Lorin Rivers wrote:
>I want to style an unordered list so that the "top-level" elements are
>bold with no bullets, while the items inside these have the bullets,
>etc...
>
>#content li
>{
> list-style-image: url(/images/bullet3.gif);
> list-style-type: none;
> line-height: 1.2;
>}
>
>/*Shout out to: http://www.simplebits.com*/
>#content p + ul.nested > li
>{
> font-weight: bold;
> list-style-type: none;
> list-style-image: none;
> margin-bottom: 0.5em;
>}
>
>#content .nested ul
>{
> font-weight: normal;
> margin-top: .5em;
>}
>
>I couldn't figure out a way to do this without sibling selectors,
>which makes IE cranky...
Easy: just reverse your CSS rules. First define the top-level
(really, all) items without bullets, then define the inner items with:
#content li
{
font-weight: bold;
list-style-type: none;
margin-bottom: 0.5em;
line-height: 1.2;
}
#content li li
{
font-weight: normal;
list-style-image: url(/images/bullet3.gif);
margin-bottom: 0;
}
Paul
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7b2 testing hub -- 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/
