Menu
Let's say I have this
<ul>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
<li>test</li>
</ul>
ul {
column-count: 2;
}
and I want to align first column to right and the second to left, is there any way to target one of those columns using css selectors?
350
It accepts the An+B notation such as used with the :nth-child selector, using this to target every nth column. The values odd and even are also valid.
The :nth-col () CSS pseudo-class is designed for tables and grids. It accepts the An+B notation such as used with the :nth-child selector, using this to target every nth column. The values odd and even are also valid. :nth-col (odd) { background-color: pink; }
If the column-width is also set to a non- auto value, it merely indicates the maximum allowed number of columns. <p class="content-box"> This is a bunch of text split into three columns using the CSS `column-count` property.
The number of columns is determined by other CSS properties, such as column-width. Is a strictly positive <integer> describing the ideal number of columns into which the content of the element will be flowed. If the column-width is also set to a non- auto value, it merely indicates the maximum allowed number of columns.
As of now, there is no way to target nth column with pure css.
136
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
