General XMetaL Discussion

XMetaL Community Forum General XMetaL Discussion list ordering and display position

  • LeeHart

    list ordering and display position

    Participants 6
    Replies 7
    Last Activity 11 years, 6 months ago

    If I use “list-style-position: outside;” and an appropriate margin-left value I get a nice numbered list. If I use counter-reset and counter-increment rules and use counter(…) in the content rule of the :before selector I can get a more fine-grained control over the numbering displayed but it's displayed inside the tag for the element, not outside. I can't figure out how to make the list-style-type: decimal; and list-style-position: outside; use the numbering set up by the counter-reset and counter-increment attributes. Is that possible?

    More information:

    Our schema has numbered procedures; the enclosing element is and the element is used for each element. For content that is conditional (e.g. for pre-release content) we have a element that sits between and . I still want the item numbering to be triggered by but XMetaL seems to use the element as the root to be counted and so each enclosed in a element has a displayed number of 1. I can get the correct number computed using counter-increment and displayed using counter() in :before but it's not as nice to work with (and doesn't resemble the final content as much.)

    Thanks,

    Lee

    Reply

    Derek Read

    Reply to: list ordering and display position

    Struggling with the description a little bit. Your content looks like which of these?

    “item” and “conditional__item” are siblings:
      text
      text
      text

    “item” and “conditional__item” are siblings and “conditional__item” may also contain “item”:
      text
      text
      text

    Something else?

    Reply

    LeeHart

    Reply to: list ordering and display position

    “item” and “conditional__item” are siblings and “conditional__item” may also contain “item”:
      text
      text
      text

    That's it. can contain or . can contain item. has another child element that describes where that conditional content should be displayed.

    Attached is an example image. The orange numbers inside the element is what I'd like to see in the list numbers outside the elements.

    And here's the relevant CSS:
    proch:before,
    list:before,
    item:before {
      color: #FF9900;
      font-style: normal;
    }

    proch,
    list {
      prefix-format: "[ %attribute-list; ] ";
      display: block;
      margin-left: 6pt;
      text-indent: -3pt;
      list-style-position: outside;
    }

    proch {
      counter-reset: proch;
      list-style-type: decimal;
    }

    list {
      list-style-type: disc;
    }

    item {
      prefix-format: "[ %attribute-list; ] ";
      margin-left: 12pt;
      text-indent: -3pt;
      display: list-item;
    }

    proch > conditional__item > item:before,
    proch > item:before {
      content: counter(proch, decimal) ". ";
    }

    proch > conditional__item > item,
    proch > item {
      counter-increment: proch;
    }

    proch proch {
      list-style-type: lower-alpha;
    }

    proch proch > conditional__item > item:before,
    proch proch > item:before {
      content: counter(proch, lower-alpha) ". ";
    }

    list[nobullets="1"] {
      list-style-type: none;
    }

    Reply

    Derek Read

    Reply to: list ordering and display position

    So, this isn't a numbering issue (your numbers are correct) they just aren't displaying in the correct position?

    Our rendering engine displays numbers for “true” lists in the position you see in your screen capture (with some room to adjust that using margin and text-indent). It displays CSS “:before” content in the position it is rendering as well, with no option to adjust the positioning unfortunately.

    So, I don't think there's anything you can do in this case.

    Reply

    LeeHart

    Reply to: list ordering and display position

    It is a numbering issue – I'd like to be able to tell the “true” lists displayed by list-style-type and  list-style-position rules to use the values computed by the counter-reset and counter-increment rules.

    Lee

    Reply

    Derek Read

    Reply to: list ordering and display position

    OK, so just to be really clear can you post (in text) an example of the expected numbering?

    Reply

    LeeHart

    Reply to: list ordering and display position

    Because I don't expect the CSS to be able to support the selection logic used by the XSLT, I just want it to be displayed as if it was one list:
    1. This is item one.
    2. This may be item two.
    3. This may also be item two.
    4. This may be item three.
    5. This may also be item three.
    6. This may be item two or four.

    Currently it looks  like this, which makes it hard to tell it's all part of one list:
    1. This is item one.
    1. This may be item two.
    1. This may also be item two.
    1. This may be item three.
    1. This may also be item three.
    2. This may be item two or four.

    Thanks,

    Lee

    Reply

    Derek Read

    Reply to: list ordering and display position

    Is it as simple as this then?
    (I've removed all the other styling not specific to this numbering for clarity)
    I'm not sure I understand what the markup should be for that last item (“This may be item two or four.”), so this still might not be right.

    proch {
      display: block;
      padding-left: 1em;
      list-style-type: decimal;
    }

    item, conditional__item {
      margin-left: 2em;
      display: list-item;
    }

    conditional__item item {
      display: inline;
    }

    Reply

  • You must be logged in to reply to this topic.

Lost Your Password?

Products
Downloads
Support