Posted by Ben C on 11/07/06 17:53

On 2006-11-07, z <news01.web@mailnull.com> wrote:
> Ben C wrote:
>
>> On 2006-11-06, z <news01.web@mailnull.com> wrote:
[snip]
>>> The list-style-image that I added didn't seem to work either.
>>
>> You don't see the bullets at all, or you see them, but they're in the
>> wrong place?
>
> I see the bullets, but they are too far to the left of the list items, and
> overlapping with the <li>s to the left.

Understandable-- the browser just offsets the bullets to the left of the
list items. This works OK most of the time, but not if the list items
are floated.

> I tried list-style-position: inside;, but that just put the list items
> on a line below the bullets.

Interesting, I suppose it didn't float them. One way to implement
list-style-position: inside is for the browser to pretend the bullets
were display: inline and insert them before the list item content. That
might account for the behaviour you're seeing. Anyway, it's not
something you can control precisely.

> I'm reading about another way to remove the list-style-image and use a
> background image, but haven't tried it yet.

That sounds like a better approach. You could give them a bit of left
padding and a background image positioned at the left.

[snip]
> Thanks for your help. This is the most difficult thing I've ever
> tried to do in CSS. I wouldn't have thought it possible. I am
> impressed with your knowledge of CSS. Is there a book on CSS that you
> could recommend that would explain these things clearly? I have a
> couple of CSS books already, but not impressed with them. I like
> computer books that get to the point really fast.

I don't know of any, but I'm sure there are good books. I just read the
CSS 2.1 spec, which is clear, comes from the horse's mouth and certainly
gets to the point fast. But it's not always the most readable thing. You
can get it from here: http://www.w3.org/TR/CSS21/

[Back to original message]