[css3 lists] list-style-direction

The following is a proposal for some bidi-related changes to CSS3

1. An additional list-related property: list-style-direction.

The property would determine the direction of the list marker, when it is a
separate box, i.e. when list-item-position is "outside". The effects of the
marker's direction include:

   - The location of the marker box, since it is on the "start" side of
   list-style-direction. For example, with list-item-direction:ltr, the marker
   box is to the left of the list item.
   - The bidirectional ordering of the marker text. For example, with
   the marker text "1." is displayed visually as ".1".

list-style-direction would take one of the following values:

   - ltr
   - rtl
   - match-list
   - match-item

For backward compatibility with CSS2, the default value would be match-item.

Note, however, that since the marker box is displayed in the margin, and
since a list by default only creates a margin on its start side, match-item
works poorly for  list items whose direction is opposite to the list's
direction. This is the reason why currently, most or all of the marker is
invisible for such items in all major browsers. Furthermore, it turns out
that in many or most use cases (at least in Hebrew, Arabic, and Persian),
the preferred look is to have all markers appear on the same side, even
though different items have different direction. Thus, we would really want
the default to be match-list, but can not make it so because of CSS2

As a workaround, we therefore propose that the default style sheet would
specify list-item-direction:match-list for all ol and ul elements.

2. Currently, there is no interoperability regarding whether text-align
applies to the list item marker when list-item-position is "outside". IE,
Firefox and Opera keep the marker with the item, i.e. apply the alignment to
the marker. WebKit, on the other hand, applies the alignment only to the
item, but keeps the marker location constant regardless of text-align. As a
result, there is a big difference between the way <ul style="text-align:end>
is displayed in WebKit and the other browsers.

I bring this up in this context because the same issue would come up for
list-style-direction:match-list in combination with text-align:start as it
applies to opposite-direction items.

IMHO, WebKit's approach here is more useful. When users want the marker kept
together with the item, they should use list-style-position:inside. With
list-style-position:outside, the markers should line up.


Received on Monday, 1 November 2010 02:04:42 UTC