When the list-style-position is set and the li element is nested with block elements, the layout of the Firefox browser becomes invalid.

When the list-style-position is set and the li element is nested with block elements, the layout of the Firefox browser becomes invalid.
Put the ul list style symbol in the list, and naturally you want to set list-style-position: inside. However, when the li element is nested with a block element, Firefox is a tragedy.

View: http://codepen.io/xiaoyewen/pen/KpzMLO

The effect in Firefox is as good as Chrome and IE.

 

It seems that the effect cannot be achieved smoothly in this way. Instead, you can change your mind and generate small black spots.

. List div: before {content: '.'; font-size: 20px; position: relative; top:-2px ;}