Page 1 of 1
Hide Layout Grid by Size
Posted: Thu Apr 25, 2019 9:53 pm
by harvillo
I have a layout grid which I'd like to hide on on mobile devices. I'm fairly sure this can be dome with events, but I'm not sure which one.
Re: Hide Layout Grid by Size
Posted: Thu Apr 25, 2019 10:09 pm
by crispy68
Are you using breakpoints? If so, just hide it in the object manager at the desired breakpoint.
Re: Hide Layout Grid by Size
Posted: Fri Apr 26, 2019 3:37 pm
by harvillo
I’m using layout grid exclusively. No breakpoints.
Re: Hide Layout Grid by Size
Posted: Fri Apr 26, 2019 3:55 pm
by crispy68
My guess would be to add a CSS media query to your page like such to hide the layout grid when a certain viewport is met:
Code: Select all
<style>
@media screen and (max-width: 480px) {
#NameOfYourLayoutGrid {display:none;}
}
</style>
Change the max-width to the width you want your layout grid to be hidden. Also, change the 'NameOfYourLayoutGrid' to whatever it is called in your project. As a note, I'm not where I can test this but in theory this should work.
Re: Hide Layout Grid by Size
Posted: Sat Apr 27, 2019 2:47 am
by harvillo
That’s perfect. I’m new to the software. I see a few ways to add the code. Would this be by using the html module? Should I insert Between body tags?
Re: Hide Layout Grid by Size
Posted: Sat Apr 27, 2019 4:26 am
by crispy68
Simply insert the code by clicking on Page --> Page HTML --> Between <head></head> tags
Re: Hide Layout Grid by Size
Posted: Mon Apr 29, 2019 2:47 pm
by harvillo
Worked perfectly. Thank you!!