How do you convert the 2 columns blog page to 3 columns? Here is the simple procedure. You will edit the style.css file of your Essence Pro theme. Open the style.css file on editor and do the following changes:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
/** Replace this CSS **/ .half-width-entries .content .entry { float: left; margin-left: 4%; text-align: center; width: 48%; } /** WITH THIS CSS **/ .half-width-entries .content .entry { float: left; margin-left: 4%; text-align: center; width: calc( ( 100% - 8% ) / 3 ); } |
And
|
1 2 3 4 5 6 7 8 9 10 11 |
/** Replace this CSS **/ .half-width-entries .content .entry:nth-of-type(odd) { clear: left; margin-left: 0; } /** WITH THIS ONE**/ .half-width-entries .content .entry:nth-child(3n+1) { clear: left; margin-left: 0; } |
Worked with old child theme. Doesn’t work with 1.5.0