Gridstack.js: Ability to specify left right padding on columns as well As vertical margin between rows

[ishields]

@troolee In some cases you want to be able to define the padding on columns and rows. By default currently rows have a padding of 20px and columns have a padding of 10px on both left and right sides. These values should be options. This will allow users to have grid items touch if so desired.

[ishields]

Looks like vertical margin is actually an option already - "vertical_margin". And now that I look closer left and right padding can simply be overridden in the css

.grid-stack-item-content, .placeholder-content{
left: 0;
right: 0;
}

Assuming this does not have any negative effects in calculating positions, this should work fine.

[troolee]

Hi,

Yes, vertical margins are defined and could be overrode in CSS:

.grid-stack-item .grid-stack-item-content,
.grid-stack-item .placeholder-content {
    left: 10px;
    right: 10px;
}

and vertical margin could be overrode during initialization.

[gustavomick]

just out of curiosity. Why is it 20 and not 0 by default.. or configuratble anyway, it seems to me a usual need.. any thoughts welcome in advance.

[tomgallagher]

I'm slightly stumped why there's no horizontal margin setting. Over-riding the horizontal margin settings in CSS does not seem to work for me. So I have a nice 20px gap between rows and no gap at all between columns.

[DavidKDeutsch]

I found that I had to add a class to the selector to get a high enough specificity:

.grid-stack .grid-stack-item .grid-stack-item-content,
.grid-stack .grid-stack-item .placeholder-content {
    left: 10px;
    right: 10px;
}