I don't understand why my <li>
within my <ol>
are displaying in this peculiar way. It is happening in both firefox and chrome. Somehow they are not aligning properly. This is happening when I create the elements with both jQuery and JavaScript.
var limit = 10000, wrapper = document.getElementById("vanilla_wrapper"), el;
for (var i = 0; i <= limit; i++){
jq_wrapper.append("<li></li>");
}
for (var i = 0; i <= limit; i++){
el = document.createElement("li");
wrapper.appendChild(el);
}
Edit JSBIN
Edit 2
Adjusting the padding as suggested still has very odd formatting: