I need to display a two column list of items according to the following rules:
You could try something like:
.option:nth-of-type(n+5) {
position: relative;
left: 14ex;
top: -6em;
}
.option:nth-of-type(n+9) {
color: red;
left: 28ex;
top: -12em;
}
... for four items a column, where line-height
is 1.5em
and column width will be 14ex
.
But because this uses relative positioning, you'll probably have to reduce the size of the container.
Also, according to w3schools, this property isn't available in IE8 or lower.