需要在移动设备上制作单个帖子页面容器全宽

Question

I picked Kadence theme for my blog and so far i'm loving it but currently i'm facing a problem when editing the single posts page.

I want to have "boxed" content style on desktop which looks better than full width in several smaller screen computers and full width content style on mobile only.

The theme's default editor only gives me the option to switch to either one, it's not possible to choose a different setting for each device.

When browsing on mobile with the "boxed" content style there's a huge margin which makes the content appear too narrow, this is fixed when setting content style to "full width". But with this option selected the desktop version's content is way too wide for some smaller computer screens.

I've tried using "additional css" in the customizing options present in my theme and put some code I found after a quick browsing session but so far nothing worked as intended.

Any sort of help with this will be appreciated.

Thanks in advance.

Answer 1

you can use media query css with single post type class.

@media only screen and (max-width: 767px) { .single-post target-class { //CSS code }}