html - add sup tag in ul li goes next line -

i try make 1 list new label. come ok when text less. new label come in next line if text more. code follows:

<ul>    <li> text 1 <sup>new</sup> </li>    <li> text 1 <sup>new</sup> </li>    <li> text 1 <sup>new</sup> </li>    <li> large text <sup>new</sup> </li> </ul> 

jsfiddle

how fix this.

the problem adding width ul refer below fiddle.

fiddle

you can either remove width of ul or simple add follows.

css

ul li {     width: 100%; }