[Resolved] show columns diffrent on mobile and desktop

Home Forums Support show columns diffrent on mobile and desktop

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #944525
    Anders

    Hi

    Is there a way to show columns diffrent on mobile and desktop?

    I have a contact-form on the contact page placed at the right side of the screen – using desktop

    Using:

    div class="grid-60 tablet-grid-60 mobile-grid-100 first-column"
        First column content etc...
    /div
    <div class="grid-40 tablet-grid-40 mobile-grid-100 second-column">
        FORM HERE
    </div> 
    

    On mobile the form is showed below the content… But I want the contact-form to be first, and content second! (and still have the contact-form at the right using desktop)

    Is that posible?

    #944714
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    You can use the pull and push classes for that.

    For example:

    <div class="grid-40 tablet-grid-40 mobile-grid-100 second-column push-40">
        FORM HERE
    </div> 
    
    <div class="grid-60 tablet-grid-60 mobile-grid-100 first-column pull-60"
        First column content etc...
    </div>

    Let me know if that does it or not 🙂

    #944789
    Anders

    Hi Tom
    It works on mobile, but the desktop look a little wierd…

    #944792
    Anders

    Works now… Changed the push/pull values:

    <div class="grid-40 tablet-grid-40 mobile-grid-100 second-column push-60">
    FORMS
    </div> 
    <div class="grid-60 tablet-grid-60 mobile-grid-100 first-column pull-40"
    some here</div>
    #944819
    Tom
    Lead Developer
    Lead Developer

    Ah perfect – glad you got it working 🙂

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