Removing the Grid Width on Mobile Devices

sondrmedia · August 2018

Hi there,

How can I remove the Grid Width on Mobile Devices?

Right now I have it set at 1920px.

Thanks!

Bryan · August 2018

HI,

the mobile grid width can be set in theme options>responsive>general

thanks

sondrmedia · August 2018

Perfect. Thanks Bryan

bryanteo · August 2018

Hi Support,

I find that even though I have set the mobile grid width to 700px under theme options>responsive>general, my site is not using the full width on the mobile screen.

Please find screenshot attached where there is still padding at the sides:

https://1drv.ms/u/s!AsDd2QeCy2RnhuI-3lorlvG5TrLuLQ

Link to this page is:

https://health-bay.com/types-of-juicers/

Thanks.

Pablo · August 2018

bryanteo

I do not understand what you is your issue.

Also, there is only one screenshot on google drive you send.

Please describe it greater.

Thanks.

bryanteo · August 2018

Hi Pablo,

Thank you for your reply.

I find that when my site is viewed using a mobile device, there is padding on the left and right-hand side of the screen. As such, I feel that there is "wasted" space because of this padding.

I find that other sites use the full width of the mobile screen. The below two screenshots will hopefully show you the comparison of what I am trying to explain:

https://1drv.ms/u/s!AsDd2QeCy2RnhuI-3lorlvG5TrLuLQ (my site with padding)

https://1drv.ms/u/s!AsDd2QeCy2RnhuJBtXnE8p8mSjbe0A (other sites without padding)

I am wondering if there is a theme setting that would allow the full width of the mobile device screen to be utilized.

Thanks.

Pablo · August 2018

This will make troubles on other pages than post.

That's why I made it only for posts.

Use this Custom CSS:

@media (max-width:767px){
body.post-template-default .section_wrapper, .container, .four.columns .widget-area{
	padding:0 !important;
  text-align:center;
	}
}

Thanks

bryanteo · August 2018

OK - I will give it a go... Thanks!

Removing the Grid Width on Mobile Devices

Comments