Page 1 of 1

Unable to set row/column space in grid

Posted: Tue Aug 02, 2022 8:08 am
by mkandhan
Hi There,

I would like to add space between rows, so I tried with css possibilities such as 'border-spacing' and 'row-gap'. Still, I'm unable to achieve the result.

Please find the below css code and let me know if anything I have missed or how can we achieve to add space between rows?

.mobile-grid {
position: absolute;
border-collapse: separate;
border: 0px;
background: #dcedf9;

display: -webkit-box;
display: -ms-flexbox;
display: flex;
table-layout: fixed;
-ms-flex-line-pack: center;
align-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
overflow: hidden;
}
.mobile-grid .cell.even,
.mobile-grid .cell.odd {
background: #FFFFFF;/* Border/Dark3 */

border: 1px solid #D7E2ED;
box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.05);
border-radius: 10px;
-webkit-box-sizing: border-box;
box-sizing: border-box;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-line-pack: center;
align-content: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: start;
-ms-flex-pack: start;
justify-content: flex-start;
padding: 5px !important;
}

Thanks in Advance!
Muthu

Re: Unable to set row/column space in grid

Posted: Tue Aug 02, 2022 8:15 am
by Emily
Hi Muthu,

Can you give us more information on exactly what you mean by adding 'space between rows'? Are you wanting to change the spacing within the grid rows? Or are you wanting to add blank rows between your grid records? Or is there something else that you're trying to accomplish? The more information that we have, the better we can help.

Thanks!

Re: Unable to set row/column space in grid

Posted: Tue Aug 02, 2022 8:24 am
by mkandhan
Hi Emily,

I would like to change the spacing within the grid rows like the attached screenshot,

Re: Unable to set row/column space in grid

Posted: Tue Aug 02, 2022 9:30 am
by Emily
Hi Muthu,

Unfortunately, our grid widget does not allow for spacing between rows like you've shown in your image. You could try creating your own grid widget to use for this, as mentioned in our documentation: https://docs.profoundlogic.com/x/FQAt. You could also try something like EJS: https://docs.profoundlogic.com/x/lAHdAQ.

We hope that this helps.