Hello, I would like to reduce margins of articles text, but only on mobile devices, so that the article on mobile almost takes full width of the device. Specifically, a margin-left: -20px; margin-right: -20px; would do, but how do i add that code to mobile devices only?
Reduce margins on articles (mobile only)
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
Hi n3d1117
Shooting from the hip here but most likely something like this:
@media (max-width: 680px) { .single #main { padding-right: 5px; padding-left: 5px; }Add the above to Appearance > Custom CSS and edit as required.
Thank you! It worked straight away. How do I extend that to blog page too?
Super, glad that helped.
Including blog and archive should look something like this:
@media (max-width: 680px) { .blog #main, .archive #main, .single #main { padding-right: 5px; padding-left: 5px; }Thanks! That worked too. Last question: how to extend that to every single page in the site? (While keeping meta slider in home page full width)
For that you can just say:
@media (max-width: 680px) { #main { padding-right: 5px; padding-left: 5px; }Meta Slider comes before #main.
Much love for you Andrew <3
Super, glad that helped :)