Using Class to Alter Padding and Margins in a Text Box

Support
#1

Folks,

I want to use “Class” to alter a text box’s margins and padding when displaying on mobile versus desktop/laptop. So far none of my experiments have been fruitful.

I’m trying to create CSS like this:

@media only screen and (max-width: 700px) {
.mobi {
padding-top: 20px;
padding-right: 20px;
padding-bottom: 20px;
padding-left: 20px;
}
}

What am I doing wrong?

#2

Hello Myst,

Thanks for writing in!

You code should have work. You may also update the code into this:

@media (max-width: 700px) {
  .x-text.mobi {
    padding-top: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
    padding-left: 20px;
  }
}

Make sure that you have added the class mobi into your text element. If nothing is helping, provide us access to your site so that we can check your settings. Please create a secure note with the following info:
– Link to your site
– WordPress Admin username / password
​
To know how to create a secure note, please check this out: https://theme.co/apex/forum/t/how-to-get-support/288

Regards.

#3

Thank you so much. That fixed the problem. :slight_smile:

#4

We are delighted to assist you with this.

Cheers!

#5

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.