By Mist on Sunday, 20 July 2014
Posted in General Issues
Replies 3
Likes 0
Views 597
Votes 0
Hi guys.
I am currently working on designing our EasySocial stream. We have all the HTML (bootstrap based) design for the stream layout and i have to implement it in EasySocial.

How can i "split" the stream flow on 2 columns. Basically i am using a regular bootstrap 3 columns like this


<div class="row">
<div class="col-lg-6">
THIS IS COLUMN 1
</div>
<div class="col-lg-6">
THIS IS COLUMN 2
</div>
</div>


I have to figure out a way to make EasySocial "push" it's stream output on 2 different columns.
Any hints on how to achieve this ? Thanks !

We have designed everything ... we just have to plug-it in
I don't think you could split it this way because you'll probably need to add in a lot of other calculation as well. I guess what you need to do is to use css to float items on the left for each stream items and enforce a width to this.
·
Sunday, 20 July 2014 15:58
·
0 Likes
·
0 Votes
·
0 Comments
·
body div#fd.es .es-container .es-content
-webkit-column-count: 3


This was the best I could do. I cant understand why the second row is starting like that mark, any suggestions ?
Also as far as mobile I think a override needs to be added so on mobile it is put back into one row.
·
Sunday, 20 July 2014 17:07
·
0 Likes
·
0 Votes
·
0 Comments
·
I don't think you should use -webkit-column-count because this only works on webkit based browsers? The idea is to float items on the left and to set a fixed height on each stream item.
·
Sunday, 20 July 2014 22:25
·
0 Likes
·
0 Votes
·
0 Comments
·
View Full Post