nth-child CSS Selectors For 4 Column Layouts
Here’s how to select every element of either the 1st column, the 2nd column, the 3rd column, or the 4th column. This applies to 4-column galleries, or any setup of 4 columns (such as divs or paragraphs with class “one-fourth”).
/* first column */
.grid_3:nth-child(4n-3){
padding-left: 0;
}
/* second column */
.grid_3:nth-child(4n+2){
padding-left: 2%;
padding-right: 2%;
}
/* 3rd column */
.grid_3:nth-child(4n+3) {
padding-left: 2%;
padding-right: 2%;
}
/* 4th column */
.grid_3:nth-child(4n+4){
padding-right: 0;
}
Questions and Comments are Welcome