This is the code for the 3 columns layout style i am using, but i cant seem to get it to work the way i want:
this code is separating one article into three rows: the text, picture, and title from one simple article into three parts. I just want 3 separate rows going horizontally from left to right. i want each row containing one article, not breaking one article into three parts... any Suggestions?
I love the Groundwork theme and i would rather end my search with this theme if i can get past this one obstacle.
These codes gave the same imperfect results:
article {
-webkit-column-count:3;
-moz-column-count:;
column-count:3;
}
#node-1 p,
.front .views-row {
.column();
}
#node-1 p {
.unit(6);
}
.front .views-row {
.unit(8);
}
I know the above code is for a node id, therefore, i would like have any suggestions for the proper code, as well?
Comment | File | Size | Author |
---|---|---|---|
#1 | 3col-articles.jpg | 158.73 KB | JohnFilipstad |
photo.JPG | 28.09 KB | alkhalife |
Comments
Comment #1
JohnFilipstadAs mentioned in the docs, you use the mixins .column() and .unit(N).
The .column() mixin will give you the styles to make the element float, while the .unit(N) mixin is for the width of the element. Probably
This depends actually on the number of units or width of the parent element. You might also need to remove the left margin of the 1st, 4th, 7th, etc, and the right margin of the 3rd, 6th, 9th... if this is a 3 column grid.
Or you might want to use percentages instead...
Comment #1.0
JohnFilipstadProper support for the groundwork 3 columns article layout code?