xml counting elements in a list does not work in firefox

问题

I am writing some CSS to customise the display of an XML document. Basically I want to customise the display of child elements, and render them similar to HTML OL/UL/LI elements.

My XML is structured like this:

 <?xml version="1.0"?>
 <?xml-stylesheet type="text/css" href="style.css"?>
 <transcription>
      <turn>
          <speaker>Speaker Name</speaker>
          <clause>
              text here
          </clause>
          <clause>
              one or  more clauses
          </clause>
      </turn>
  </transcription>

My CSS looks like this:

turn {
    counter-reset: item;
}

turn clause {
    display:list-item;
}

clause  {
    content: counter(item);
    counter-increment: item;
}

I am using this site: http://www.xml.com/lpt/a/401 and basically have a similar document http://www.xml.com/2000/03/29/tutorial/examples/display1.xml, the problem is that the display1.xml does not work in firefox. I do get it working in IE, Safari, Chrome etc.

Can any provide a link, or sultion that would work in firefox, as well as the other browsers?

回答1:

It looks like there is some bug in the way that firefox implements the display: list-item property, specifically the passing of the counter value. I believe this gives rise to the zeros which show in firefox, but not in chrome.

My workaround is to forget about using 'display: list-item' and instead style the items directly so they appear as a list:

transcription {
      counter-reset: item;
}

clause {
      display:block; 
      margin-left:40px; 
}

clause:before  {
      counter-increment: item;
      content: counter(item)  ". ";
}

this works with the following XML:

<?xml version="1.0"?>
<?xml-stylesheet type="text/css" href="style2.css"?>
<transcription>
    <turn>
    <speaker>Speaker Name</speaker>
    <clause>
        text here
    </clause>
    <clause>
        text here
    </clause>
    <clause>
        text here
    </clause>
</turn>

let me know how you get on...

来源：https://stackoverflow.com/questions/3279635/xml-counting-elements-in-a-list-does-not-work-in-firefox

标签

css

xml

firefox

cross-browser

pseudo-element