span:before { counter-increment: c 1; content: "B" counters(c,".") "-" }
  span:after  { counter-increment: c 1; content: "A" counters(c,".") "-" }

  body, span#reset:after { counter-reset: c 0; }

  </style>
 </head>
 <body>

 <p>The following two lines should be the same:</p>

 <div><span><span id="reset"><span></span></span></span></div>
 <div>B1-B2-B3-A4-A4.1-A5-</div>

 </body>
</html>