如何将有序列表项表与数字对齐？

Question

I have an ordered list of tables that contain 1 row and 2 columns using the code below.

I am trying to get the first line of the table paragraph to align to the number similar to normal list items. For some reason it is not aligning and the number is showing at the bottom.

How can I 1. align the table row paragraphs to the number similar to the first item and 2. align the "56 citations" paragraph to the other td in the table.

Thanks!

 <ol> <li> <p>This is what a normal item</p> <p>looks</p> <p>like</p> </li> <li> <table> <tr> <td> <p>This is what a table item</p> <p>looks</p> <p>like</p> </td> <td> <p>56 Citations</p> </td> </tr> </table> </li> </ol>

Answer 1

Use vertical-align: baseline in the td element, like this:

 td { vertical-align: baseline; }

 <ol> <li> <p>This is what a normal item</p> <p>looks</p> <p>like</p> </li> <li> <table> <tr> <td> <p>This is what a table item</p> <p>looks</p> <p>like</p> </td> <td> <p>56 Citations</p> </td> </tr> </table> </li> </ol>