[Support request] Padding left and right in columns

[Chris]

Can I insert Padding left and right in section columns?

First column content

Second column content

Third column content

[David]

Hi there,

i am not sure what column add-on you are using but looking at one of the pages i can see these classes: .tmm .tmm_member so you could target them with some CSS. Let me know.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

Hello, I mean insert padding for this columns: https://docs.generatepress.com/article/creating-columns/

[David]

You could add your own class to make it clearer to style them e.g: grid-style

<div class="grid-style grid-33 tablet-grid-33 mobile-grid-100 first-column">
    First column content
</div>

Then this CSS:

.grid-container .grid-style {
    padding: 15px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

Great David, Thanks!!! 👍

[David]

You’re welcome 🙂

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

David, is this padding for left or right?
.grid-container .grid-style {
padding: 15px;
}

[Chris]

David, the padding is not working, see: https://www.beurstrading.nl/test1/

[David]

That looks like Lightweight Grid Columns…… If so then edit the shorcode it outputs and add your class in there:

[lgc_column grid="25" tablet_grid="50" mobile_grid="100" class="grid-style"]Some content[/lgc_column]

Then strip back the CSS:

.grid-style {
    padding: 15px;
}

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

David, I have put your code, but now there are no columns, see https://www.beurstrading.nl/test1/

[David]

Edited the above code – double quotes pasted in badly….

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Chris]

Yes, it works!👍

I use this, is that good?

grid=”33″ tablet_grid=”33″ mobile_grid=”100″

And is this padding left or right?

.grid-style {
padding: 15px;
}

[Chris]

David, it looks good! (I think?) 😁 https://www.beurstrading.nl/test1/

[David]

Awesome. So padding that would be all 4 sides.

You can do them individually: eg. padding-left: 10px; or you can do them as a set: padding: 10px 10px 10px 10px; the 4 variables are Top, Right, Down, Left.

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts