The second line is wrapped below the > symbol. Using the default list-style-position: outside; won't solve the problem. The only solution is to use table display style to make it looks like a table cell and row. So using the following stylesheet and display attribute will solve the problem.
padding: 0 10px 0 0;
As you can see below, the text is formatted better.
You may notice that the bottom border line for each item are gone. It's because that the display: table-XXXX will cause browser to ignore the style on div, span or a element. The margin, padding in li stylesheet will also be ignored. It also doesn't work in IE8 and older browser.