html - How can I show text and a picture in an ordered list? -
i need create ordered list, has text , pictures.
i.e.
to this, have put text , images in tables.
<ol> <li> <table> <tr> <td> tyrannasaurus </td> </tr> <tr> <td> <img style="float: left; margin-top: 5px;" src="tyrannasaurus.png" /> </td> </tr> </table> </li> <li> <table> <tr> <td> brontosaurus </td> </tr> <tr> <td> <img style="float: left; margin-top: 5px;" src="brontosaurus.png" /> </td> </tr> </table> </li> <li> <table> <tr> <td> triceratops </td> </tr> <tr> <td> <img style="float: left; margin-top: 5px;" src="triceratops.png" /> </td> </tr> </table> </li> </ol>
however, problem numbers don't line text- numbers high.
is there better method should using? doesn't seem should hard.
you can use this:
<ol> <li> <h3>animal 1</h3> <img src="http://lorempixel.com/400/200/animals/1/" alt=""> </li> <li> <h3>animal 2</h3> <img src="http://lorempixel.com/400/200/animals/2/" alt=""> </li> <li> <h3>animal 3</h3> <img src="http://lorempixel.com/400/200/animals/3/" alt=""> </li> </ol>
the above code looks way:
Comments
Post a Comment