So I have this list of daily Bible here
There are 89 of them, which made it a little hard to read (IMO). Plus, since they are daily readings, I thought it would be good to put a blank line after each week.
How to do that…. hrm…. well, I could use a <br> which isn’t valid (but works) but I’d have to count the lines and make sure I had them in the right places.
I could make separate <ol>’s and reset the value at the beginning, so the end of the first week and beginning of the second would look like this:
</ol>
<ol><li value=”8”>
But, come on, then I have to make a bunch of different lists, when it’s really one list. I have to hard code all the values into a list. Hardly elegant or semantic.
And I still have to count.
The whole thing reeks of ugly hack.
Isn’t there a way that my computer can do the work for me?
Turns out, there is.
to the rescue. Here’s one of their examples:
tr:nth-child(2n) /* represents every even row of an HTML table */
Well, what if instead of 2n we used 7n?
li:nth-child(7n) { margin-bottom: 1em;}
Whammo Presto! See for yourself at
Except…
It doesn’t work in Firefox. Not, not even the latest nightly.
Nor does it work in Safari. Not, not even the latest nightly.
I don’t actually have IE7 installed anywhere, but I’m going to go ahead and assume it doesn’t work there either.
It doesn’t yet work in any public version of Opera.
I wonder which browser will be the first to support this very useful new addition to the world of CSS?