<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <TITLE>lists with direction:rtl</TITLE> <style> li { border:5px solid orange; padding:5px; } .img { list-style-image: url(resources/white.gif) } </style> </HEAD> <BODY> <UL style="width:20ex; border:1px blue solid;"> <LI>First item <LI>Second and very very long item <LI>Third item </UL> <UL style="direction:rtl; width:20ex; border:1px red solid;"> <LI>First item<LI>Second and very very long item<LI>Third item</UL> <UL style="width:20ex; border:1px blue solid; list-style-position:inside;"> <LI>First item <LI>Second and very very long item <LI>Third item </UL> <UL style="direction:rtl; width:20ex; border:1px red solid; list-style-position:inside;"> <LI>First item <LI>Second and very very long item <LI>Third item </UL> <UL class=img style="width:20ex; border:1px blue solid;"> <LI>First item <LI>Second and very very long item <LI>Third item </UL> <UL class=img style="direction:rtl; width:20ex; border:1px red solid;"> <LI>First item<LI>Second and very very long item<LI>Third item</UL> <UL class=img style="width:20ex; border:1px blue solid; list-style-position:inside;"> <LI>First item <LI>Second and very very long item <LI>Third item </UL> <UL class=img style="direction:rtl; width:20ex; border:1px red solid; list-style-position:inside;"> <LI>First item <LI>Second and very very long item <LI>Third item </UL> <OL style="width:20ex; border:1px blue solid;"> <LI>First item <LI>Second and very very long item <LI>Third item </OL> <OL style="direction:rtl; width:20ex; border:1px red solid;"> <LI>First item <LI>Second and very very long item <LI>Third item </OL> <OL style="width:20ex; border:1px blue solid; list-style-position:inside;"> <LI>First item <LI>Second and very very long item <LI>Third item </OL> <OL style="direction:rtl; width:20ex; border:1px red solid; list-style-position:inside;"> <LI>First item <LI>Second and very very long item <LI>Third item </OL> </BODY> </HTML>