webkit shows bullet behind floated elements in list

Answer 1

As pointed out by @silviagreen this is a webkit-specific bug but as a workaround I suggest to add a transparent border to the list-item. This seems to properly work (but I honestly admit that I can't figure out why this should work)

li {
   border: 1px transparent solid;
}

https://jsfiddle.net/rjkz7ny1/

---

Other approaches suggest to change float: left into display: inline-block or to give clear: left to the list, but I feel these workarounds a bit too substantial (and not always appliable) than adding a trasparent border.