Tagged: , , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • March 5, 2016 at 11:16 am #593695
    ramirezo

    Hello,

    I have been trying to figure this out based on some code found here, but have had no luck.

    I saw this already viewed post such as this: https://kriesi.at/support/topic/masonry-grid-mobile/#post-587079

    The most relevant and promising post was likely this: https://kriesi.at/support/topic/two-column-portfolio-in-mobile-view/#post-72381

    But the code looks to be only partially listed there.

    I would prefer to never have fewer than 2 columns in my portfolio grid.

    Can you advise as to what css or short code would be necessary?

    Thanks

    Omar

    March 7, 2016 at 2:54 pm #594333
    Vinay

    Hi ramirezo!

    Please use the below css to have 2 col portfolio in mobile view

    @media (max-width: 480px) {
#sb_instagram.sbi_col_4 #sbi_images .sbi_item, #sb_instagram.sbi_col_5 #sbi_images .sbi_item{
    width: 50%!important;
}}

    Best regards,
    Vinay Kashyap

    March 8, 2016 at 8:24 am #594870
    ramirezo

    Hi Vinay,

    Thanks. That actually covered my next question.. it did what I was looking to do, but to my instagram feed (brought in via this app/plugin: https://smashballoon.com/instagram-feed/) , but not to the avia ajax portfolio gallery (built into Enfold) below that. I’m trying to get all down in size a bit, so people get more more at a glance in mobile. I actually thought I was going to have to contact the smashballon for that tweak, so thanks.

    That being said, can you tell me what code would be necessary to get the other gallery collection thumbs to 2 columns?

    Thanks!

    Omar

    March 10, 2016 at 8:21 am #596135
    Ismael

    Hi!

    You can try this in the Quick CSS field:

    @media (max-width: 768px) {
#sb_instagram.sbi_col_7 #sbi_images .sbi_item, #sb_instagram.sbi_col_8 #sbi_images .sbi_item, #sb_instagram.sbi_col_9 #sbi_images .sbi_item, #sb_instagram.sbi_col_10 #sbi_images .sbi_item {
    width: 50% !important;
}
}

    Regards,
    Ismael

    March 10, 2016 at 9:15 am #596162
    ramirezo

    Thanks Ismael, but still no luck. You were targeting the gallery below the Instagram feed (the sortable one), correct? I was surprised to see the word instagram in the code there, but then again, I’m not a programmer. The last bit of code had actually worked for the Instagram feed (though by cropping the thumbs horizontally, not scaling uniformly.. which still works). Any other suggestions?

    thanks

    Omar

    March 14, 2016 at 8:32 pm #597961
    Vinay

    Hi!

    To make 2 columns like the screenshot below

    Please add the below CSS to enfold > General Styling > Quick CSS

    			
@media only screen and (max-width: 480px) {
.responsive #top #wrap_all .grid-sort-container .grid-entry {
    width: 48%!important;
    float:left;
}}

    Best regards,
    Vinay Kashyap

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.