CSS :nth-of-type() and :not() selector?

Question

I have floated articles side by side that are 25% wide. I\'m adding a clear:both after every fourth element. However I need to insert a graphical section-break inbe

Answer 1

The selector you have --

ul li:not(.year):nth-of-type(4n+1) { background: yellow; }

-- is perfectly correct (as shown by highlighting the selector).

The issue is with how you're using clear. It works if you use clear:right, and then clear:left on the following element:

ul li:not(.year):nth-of-type(4n+1) { clear: right;  }
ul li:not(.year):nth-of-type(4n+2) { clear: left;  }

Edit per comments The stricken-out text is nonsense. The real issue, as per BoltClock's answer, is that the :not pseudo-class doesn't affect nth-of-type. Adjusting the selector offset works in this case by coincidence, but would not work if the :not pattern was different.

ul li:not(.year):nth-of-type(4n+2) { clear: left;  }

http://jsfiddle.net/8MuCU/