Archived topic
show columns diffrent on mobile and desktop
4 replies · Started by Anders Nielsen on June 29, 2019
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?
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 :)
Hi Tom
It works on mobile, but the desktop look a little wierd...
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>
Ah perfect - glad you got it working :)