0

I have some long ordered lists and I need to left align them and wrap the text back under the text from the line above. Right now the text is wrapping all the way back under the bullet. I think I use a left pad to do this but for some reason it's not quite working correctly.

Below is my current attempt. I'm sure it's something simple I'm just not searching on the right terms. 

<li style="text-align:left;padding-left:5px; ">{{ item }}</li>
PM 77-1
  • 12,933
  • 21
  • 68
  • 111
user4107395
  • 141
  • 7

2 Answers2

0

Instead of adding CSS rules, why don't you use an ol tag as a container? That solves it.

Edd
  • 1,948
  • 4
  • 21
  • 29
0

Here is the solution according to your fiddle 

li{
padding: 10px 0 10px 20px;
text-indent: -1em;
 }

JS Fiddle Demo

Ancient
  • 3,007
  • 14
  • 55
  • 104
  • I thought `list-style-position` was for either `ol`s or `ul`s, not for their `li`s. That rule is unnecessary. Also, why `list-style-type: disc;` on an ordered list? The rest seems like a hack to me. Those `li`s should be inside an `ol` tag. – Edd Jan 28 '15 at 05:25