CSS insert break after 4th child

css, dom, html, html-lists

Solution

Add a block-element after it: http://jsfiddle.net/M4aV3/1/

ul li:nth-child(4n):after {
    content: ' ';
    display: block;
}

Problem

Currently, this example shows an unordered list with 8 list items in it. Is there a way using only CSS (no HTML or JavaScript) to insert a break after the 4th `li` item. Something like: ``` ul li:nth-child(4n):after { content = '<br>'; } ```

Original source