0

http://jsfiddle.net/wyxnvts2/

<ol>
  <strong><li>The board develops ....</li></strong>
    <ol type="a">
      <strong><li>How often and by what procedure .... ?</li></strong><span class="pending-response">Awaiting response</span>
    </ol>

  <strong><li>The board develops ...</li></strong>
    <ol type="a">
      <strong><li>A notebook containing a copy of all ...</li></strong><span class="pending-response">Awaiting response</span>
    </ol>

  <strong><li>The board is responsible ...</li></strong>
    <ol type="a">
      <strong><li>Describe the procedures by which ...?</li></strong><span class="pending-response">Awaiting response</span>
      <strong><li>Describe the process for ...</li></strong><span class="pending-response">Awaiting response</span>
      <strong><li>Submit the investment and ...</li></strong><span class="pending-response">Awaiting response</span>
      <strong><li>...</li></strong><span class="pending-response">Awaiting response</span>
    </ol>

  <strong><li>The board employs...</li></strong>
    <ol type="a">
      <strong><li>Is the head ...?</li></strong><span class="pending-response">Awaiting response</span>
      <strong><li>Describe the annual ...</li></strong><span class="pending-response">Awaiting response</span>
      <strong><li>Supply a copy ...</li></strong><span class="pending-response">Awaiting response</span>
    </ol>

  <strong><li>The board ...</li></strong>
    <ol type="a">
      <strong><li>How does the board ...?</li></strong><span class="pending-response">Awaiting response</span>
      <strong><li>Describe the working ...</li></strong><span class="pending-response">Awaiting response</span>
    </ol>

</ol>

Please check the code on jsfiddle using the Firefox browser. This works perfectly on the Chrome and Safari browsers, however goofs up on Firefox and IE.

Any help to fix this will be highly appreciated.

Thanks!

Srikanth
  • 13
  • 4

1 Answers1

0

I also ran into the same issue but while doing some research, I looked at this MDN's example, on how to do the nested lists properly

You need to have the the nested ol list inside the li tag.

To make it work properly in all browsers, your nexted list should look like:

changes:

  • strong tag is now inside the li tag
  • ol is now inside the parent li wrapper

<ol>
  <li><strong>The board develops ....</strong>
    <ol type="a">
      <li><strong>How often and by what procedure .... ?</strong></li><span class="pending-response">Awaiting
                        response</span>
    </ol>
  </li>

  <li><strong>The board develops ...</strong>
    <ol type="a">
      <li><strong>A notebook containing a copy of all ...</strong></li><span class="pending-response">Awaiting
                        response</span>
    </ol>
  </li>

  <li>
    <strong>The board is responsible ...</strong>
    <ol type="a">
      <li><strong>Describe the procedures by which ...?</strong></li><span class="pending-response">Awaiting
                        response</span>
      <li><strong>Describe the process for ...</strong></li><span class="pending-response">Awaiting
                        response</span>
      <li><strong>Submit the investment and ...</strong></li><span class="pending-response">Awaiting
                        response</span>
      <li><strong>...</strong></li><span class="pending-response">Awaiting response</span>
    </ol>
  </li>

  <li><strong>The board employs...</strong>
    <ol type="a">
      <li><strong>Is the head ...?</strong></li><span class="pending-response">Awaiting response</span>
      <li><strong>Describe the annual ...</strong></li><span class="pending-response">Awaiting response</span>
      <li><strong>Supply a copy ...</strong></li><span class="pending-response">Awaiting response</span>
    </ol>
  </li>

  <li><strong>The board ...</strong>
    <ol type="a">
      <li><strong>How does the board ...?</strong></li><span class="pending-response">Awaiting response</span>
      <li><strong>Describe the working ...</strong></li><span class="pending-response">Awaiting response</span>
    </ol>
  </li>

</ol>
Anon
  • 1,307
  • 2
  • 20
  • 30