The marker-side property positions themselves according to their list item's directionality. However, if the list item is grouped with several other list items which may have different directionality (for example, multiple

  • s with different "dir" attributes in an
      in HTML), it is sometimes more useful to have all the markers line up on one side, so the author can specify a single "gutter" on that side and be assured that all the markers will lie in that gutter and be visible.

      • Initial valuelist-item
      • Applies toList Items
      • InheritedYes
      • MediaVisual
      • Computed valueSpecified value
      • AnimatableNo
      • CSS VersionCSS3
      • JavaScript
      Formal syntax: list-item | list-container
      marker-side: list-item;
      marker-side: list-container;
      • list-itemAny markers associated with the list item base their positioning off of the directionality of the list item.
      • list-containerThe associated markers instead base their positioning off of the directionality of the list item's parent element. The normative meaning of this is specified in the section defining position:marker.
      .class {
         marker-side: list-container;;

  • Last updated on 23rd March 2014 By Rene Spronk

    View All CSS Properties

    Errors? Please help to keep this list up to date, If you find any errors, please contact us, so that we can get them fixed.