- This topic has 5 replies, 2 voices, and was last updated 6 years, 8 months ago by
.
Hi,
I am almost set with the design for my website but find that the content width is too narrow in mobile view. Possible to share a CSS code to make it automatically fit the width of any mobile screen?
Since more than 90% of views are on mobile this is essential before re-launching our magazine.
Thank you.
Hi @sadalimawi,
I hope you are well today and thank you for your question.
You can increase content width on mobile screens by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
@media (max-width: 1025px){ body #page-container .container { padding-left: 15px!important; padding-right: 15px!important; } }Best regards,
Shufflehound teamHi,
It still isn’t working well, i am viewing my site from a Galaxy S7 Edge, it’s not edge to edge yet.
Thanks.
Could you please share me your site URL where you are using the shared code so that i can troubleshoot it?
Sure, it’s http://www.thedraft.sg
Also, the mosaic grid for content on the first page looks weird on mobile too.
To make it work please use above shared code as following.
@media (max-width: 1025px){ body #page-container .container { padding-left: 15px!important; padding-right: 15px!important; max-width: 100%!important; width: 100%!important; } }Also, the mosaic grid for content on the first page looks weird on mobile too.
Could you please share the screenshot of the issue?
