Responsive CSS on Form

Hey Jas-

You'd need to add some responsive styles to the Custom CSS on the form (pg 2 in the editor, little purple gear icon). It depends on how you've got your forms styled and how you set this padding, but assuming that you didnt' have anything in the Custom CSS already, you could add padding to the .mktoHtmlText element "responsively" by using a media query to check the device size.

You might try something like this:

@media screen and (max-width:480px) {

.mktoHtmlText {padding: 0px !important;}

}

This will override any padding on your htmlText elements when the screen is mobile-sized (up to a max of 480px). Above 480px, you'll see whatever padding you setup in the editor.

Another way to accomplish this would kind of be the opposite or "mobile-first" approach where you only added the padding to the htmlText for screens larger than 480px rather than zeroing it out for mobile.

This approach would look like this:

@media screen and (min-width:480px) {

.mktoHtmlText {padding: 0px 15px !important;}

}

In this way, you wouldn't need to set the padding on the element itself on the form, it'd just get that padding when the screen was larger than mobile and otherwise show the default padding for .mktoHtmlText (which I believe is 0).

Hope this helps, let me know if you've got any questions on the media query bit.