Padding text bloc efffects mobile as well

Hi Support Team,

I have added left and right padding (150 px) to text blocs but this also effects the appearance of the text blocs in mobile view. How can I use the padding for desk top view only?

See: www.zaaldesing.nl/sabv

Thanks in advance for your support.

Kind regards,
Jan

Hi Jan,

It is normal that it will effect all screen sizes. If you want to target only some screen sizes then you need to use css media rules. Helpful reading https://css-tricks.com/snippets/css/media-queries-for-standard-devices/

In your case, best approach is to add some holding div container with some unique css class like this for example:

<div class='target-large-screens'>your text</div>

and then in order to set padding to larger screens use cs rule below:

@media screen and (min-weidt: 1024px) {
	.target-large-screens {
		padding:0 150px;
	}
}

Best Regards!

Hi Dimikjones,

Thanks for your reply.

As I am a beginner in Wordpress, I don’t know where to add the div container. Hope you can help me.

Thanks in advance,
Jan

Hi Jan,

Screenshot illustrates how to add div wrapper with a class over your text inside text widget https://www.screencast.com/t/DEJBVZex3cdM and by adding css code, it padding should be present only on larger screens. I’am unable to access your website for some reason https://www.screencast.com/t/kRquOmrRL so when you set it to be available I can check if you have set everything right.

Best Regards!