WebAIM - Web Accessibility In Mind

E-mail List Archives

RE: spacing -   versus clear images

for

From: Austin, Darrel
Date: Mar 7, 2006 10:30AM

> In that case, how do you code a right-hand padding to a <li> in CSS?


Li {
Padding-right: 1em;
}

> I have found out how to adapt the <li> tag to show a custom
> image instead of the standard bullets but can't pad it to
> keep a visually pleasing gap between the bullet and the text
> without resorting to a spacer image.

I use this:


Ul {
List-style: none;
}

Li {
Background: url('yourBulletImage.gif') no-repeat top left;
Padding-left: [theWidthOfYourImage];
}

-Darrel