Re: [css3-lists] Proposal: list-style-position inside-hanging

On 2010-06-07 11:10 AM, Brad Kemper wrote:
> Using the ::marker pseudo-element, this may be possible, once that
> CSS3 list stuff[1] is actually implemented (AFAIK, it hasn't, but I
> might be mistaken). For instance:
>
> UL { padding:3em; } LI { list-style-position: inside; } LI::marker {
> margin-left: -3em; }

I was just having this problem a week or two ago, so I'll chime in here:

An issue with your method of creating a hang is that I can't see any way 
to set a hang that's (A) exactly the width of the marker *and* (B) 
starts exactly where text would normally start in a block box. 
Presumably, I could use something like...

*::marker {
 content: "✔ ";
 display: inline-block; /* to apply margin */
 margin-left: -100%; /* left offset: width of the marker */
 white-space: pre; /* keep marker space */
}

However, while the above would solve (A), it does not meet the (B) 
requirement since, as far as I know, there is no way to set a left 
padding-/margin-length on an ancestor such that it's the exact width of 
a text marker.

Received on Tuesday, 8 June 2010 06:32:20 UTC