[pmwiki-users] advanced (I guess) CSS question for bulleted lists

Tegan Dowling tmdowling at gmail.com
Wed Jul 11 09:22:48 CDT 2007


Here are my results -- I'd like to contribute this snippet of wisdom to the
pmwiki documentation somewhere, but don't know where.  Should we have a
skinning tips page, for little pieces like this?

Specify the indentation, separation and other style characteristics of
list-items (bulleted lists) on the sidebar:

The default PmWiki skin uses the following

#wikileft ul { list-style:none; padding:0px; margin:0px; }
#wikileft li { margin:0px; padding-left: 6px; }

This sets up un-numbered lists to appear in the SideBar without the usual
bullets (list-style:none), and clears out any browser-based list-rendering
rules (padding:0px; margin:0px)

Then padding-left: 6px formats list items so that they appear slightly
indented from regular text on the SideBar.  This is minimal formatting --
more can be done.

Format list-items with hanging indents (for clarity when lines wrap):

#wikileft li { text-indent: -10px; margin: 0px 3px 5px 23px; }
/*experiment with different values of text-indent and the final margin
specification*/

Format second-level list-items:

Second-level list-items inherit the rules for the first-level items, so they
will automatically have hanging indents if you use them there, etc.  To
fine-tune their characteristics, you can do things like:

#wikileft ul ul li { font-size: 85%; margin: 0px 3px 5px 10px; }
-------------- next part --------------
An HTML attachment was scrubbed...
URL: /pipermail/pmwiki-users/attachments/20070711/74f3d19e/attachment-0001.html 


More information about the pmwiki-users mailing list