Question 312241 in Html Question posted in
Some basic documentation can be found here.

Html – OL list is not working – what is the problem?

When I run the code, the <ol> doesn’t work. It shows the word and the pl elements comes out from the box

<div id="rcorners1";tabindex="0">
     <i style="color:black">Players</i>
     <p style="font-size:2ex">   34. Only live players playing in a set may be inside the boundaries of their half. .</p>

     <p style="font-size:2ex">35. If any part of a live player touches a boundary line they are rendered out. </p>

     <p style="font-size:2ex">36. If any part of a live player touches a surface, object, or person outside of the boundary line on their team’s half of the court they are rendered out. </p>



     <ol type="a"; style="">
         <li>   That player may pass any balls they are carrying to any live player on their team.</li>
         <li>    That player may not intentionally touch any other balls.</li>
         <li>    That player may not intentionally obstruct any live players or ball retrievers.</li>
         <li>    That player may not intentionally obstruct any live balls thrown by the opposing team.</li>
     </ol>

     <p style="font-size:2ex">38. Dead players must line up in the marked player return area in the order that they have been rendered out. </p>
     <p style="font-size:2ex"></p>
     <p style="font-size:2ex"></p>
     <p style="font-size:2ex"></p>
     <p style="font-size:2ex"></p>
     <p style="font-size:2ex"></p>
 </div>

I expect my <ol> will be like this, and all of the words will be inside the box.

A live player who has been rendered out must exit the court in a timely manner from the nearest point on a boundary line.
a. That player may pass any balls they are carrying to any live player on their team.
b. That player may not intentionally touch any other balls.
c. That player may not intentionally obstruct any live players or ball retrievers.
d. That player may not intentionally obstruct any live balls thrown by the opposing team.

Tags:

3

Answers


  1. 0

    You’ve only used an <ol> for the sub-list, not the main list. You’ve used <p> (paragraph) elements, along with hard-coded numbers, for the outer list, which is not semantic.

    Here’s what your markup should look like, with the outer and inner lists (I’ve removed elements and attributes that aren’t relevant to the list):

    <ol start="34">
    <li>Only live players playing in a set may be inside the boundaries of their half.</li>

    <li>If any part of a live player touches a boundary line they are rendered out.</li>

    <li>
        If any part of a live player touches a surface, object, or person outside of the boundary line on their team’s half of the court they are rendered out.
        <ol type="a">
            <li>That player may pass any balls they are carrying to any live player on their team.</li>
            <li>That player may not intentionally touch any other balls.</li>
            <li>That player may not intentionally obstruct any live players or ball retrievers.</li>
            <li>That player may not intentionally obstruct any live balls thrown by the opposing team.</li>
        </ol>
    </li>

    <li>Dead players must line up in the marked player return area in the order that they have been rendered out.</li>
</ol>

    start="34" means the first number in the list is 34, with each subsequent <li> element incrementing it by 1.

    Login or Signup to reply.
  2. 0

    Replace the <p>‘s with <li>‘s.

    You appear to be marking up an ordered list with a nested ordered list. The outer ordered list uses numbers, e.g. "36.", and the nested list uses letters, e.g. "a.".

    In terms of displaying the nested list items inline, you’re going to break the automatic lettering (bullets). Your question then becomes, "How do I prepend incremented letters against an array of strings?"

    <ol>
<li>Players must do this.</li>
<li>Players must do that.
<ol type="a">
   <li> That player may pass any balls they are carrying to any live player on their team.</li>
   <li> That player may not intentionally touch any other balls.</li>
   <li> That player may not intentionally obstruct any live players or ball retrievers.</li>
   <li> That player may not intentionally obstruct any live balls thrown by the opposing team.</li>
</ol>
</li>
</ol>
    Login or Signup to reply.
  3. 0

    You have semicolons (;) in the attributes of the div and ol elements. In HTML, attributes are separated by spaces, not semicolons.

    <div id="rcorners1";tabindex="0">
<ol type="a"; style="">

    To:

    <div id="rcorners1" tabindex="0">
<ol type="a" style="">
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search