Okay
  Public Ticket #2159904
stacking columns on mobile
Closed

Comments

  • scottrbeck2 started the conversation

    Hello, I am looking for you best/preferred method or simplest method for stacking columns in  a specific order? The layout on desktop is fine, but in mobile/responsive mode the stack is out of preferred order. Can you please point me to some help please? I am using Salient Template v. 10.5.3 w/ WPBakery Editor. Thank you very much in advance a link to the page is https://canyonridgecc.wpengine.com/adult-groups/

  •  8,992
    Tahir replied

    Hey Again,

    Please see :Change Mobile Column Order . 

    Alternatively you can use below.

    Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):

    @media only screen and (max-width: 999px) and (min-width: 1px) {
        #women .col.span_12 {
            flex-direction: column-reverse;
        }
        #couples .col.span_12 {
            flex-direction: column-reverse;
        }
        #married .col.span_12 {
            flex-direction: column-reverse;
        }
        #young-adults .col.span_12 {
            flex-direction: column-reverse;
        }
    }

    Thanks


    ThemeNectar Support Team 

  • scottrbeck2 replied

    AWESOME!! Thank you!!

  • scottrbeck2 replied

    would i use the same type css for this page http://canyonridgecc.wpengine.com/locations/ even though it does not have anchor points?

  •  8,992
    Tahir replied

    Yes you can use that though will have to change the Row ID accordingly. 

    Bes t


    ThemeNectar Support Team 

  • scottrbeck2 replied

    Thank you