Padding between row/section

[BKosarek]

Hello:

I am trying to increase padding between the boxes when viewed in mobile format. Right now, the boxes are spaced on laptop format. But when you view them, each row connects the three boxes and then a space between the next row. You can see what I am mentioning when you view this link in mobile format.

http://www.humanityfest.org/speakers/

Please let me know if it’s possible to add padding between the boxes in the same row/section.

Thanks,
Bryan

[Prasant]

Hello Bryan,

Thanks for reaching out.

Open the page in Cornerstone and add class to each Column under Column > Customize > Setup > Class. After that add following CSS under X > Theme Options > CSS:

@media only screen and (max-width: 600px) {
  .class-col {
    margin-top: 20px;
}
}

Please change the class name as per requirement.

Thanks.

[BKosarek]

Thank you. I looked and am uncertain where the column > customize > setup > class is located… can you share a screenshot?

[BKosarek]

@Prasant

@media only screen and (max-width: 600px) {
.class-col {
margin-top: 20px;
}
}

I found the space you mentioned. But in the field “class” what do I add in that space?

[nabeel]

Hey Brian,

Add a class class-col in each of your columns (see screenshot)

Then you can add the code provided above in the Theme Options > CSS

@media only screen and (max-width: 600px) {
  .class-col {
    margin-top: 20px;
  }
}

Hope this helps!