Okay
  Public Ticket #829982
Row Layout in mobile
Closed

Comments

  • Udi started the conversation
    July 13, 2016 at 11:36pm

    Hi,

    I built 1/4 row layout and placed in each row image, you can see here below the title "We are excited to share all our bubble shooter titles:"  http://ilyon.dreamhosters.com/ilyon-bubble-shooter/

    The current state when browsing with smartphone is that the 1/4 Row Layout becomes 1 row layout 

    I want it to become 1/2 row layout instead.


    Thanks,

    Udi 



  •  9,030
    Tahir replied
    July 16, 2016 at 12:07am

    Hey ,
    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

    @media only screen and (max-width: 1000px) and (min-width: 0px) {
    .one-fourths.vc_col-sm-3 {
        width: 48%!important;
    }
}

    Best.

    ThemeNectar Support Team 

  • Udi replied
    July 23, 2016 at 4:45pm

    Hi

    Thanks, It works, but i have some issues I can't manage to solve:

    On mobile view"

    1 -  In some rows there is no proper alignment / height, I want to columns to be in the same height  (in the first row I've tried using the: 

    Equal height -  Yes If checked columns will be set to equal height.

    But I don't think it worked 

    2 - In some rows I have only one item instead of 2.

    http://www.ilyon.net/ilyon-bubble-shooter/


    Thanks,

    Udi 

  •  9,030
    Tahir replied
    July 25, 2016 at 4:11pm

    Hey Again,
    Add this into the Custom CSS box located in your Salient Options panel (Make Sure there are no red cross in the Box) :

    @media only screen and (max-width: 1000px) and (min-width: 0px) {
    .one-fourths.vc_col-sm-3 {
        min-height: 320px!important;
    }
}

    Best.

    ThemeNectar Support Team 

  • Udi replied
    July 26, 2016 at 1:29am

    Thanks, works like a charm!