How to remove whitespaces in the Accordion-Item

Hello! My question is quite a simple one, how can i remove those blank spaces in my accordion item ?

Have you validated if you have empty containers between those lines?

Nuno Miguel Verdasca wrote:

Have you validated if you have empty containers between those lines?

There are no empty containers i just want to remove the default blank spaces in this widget 


Hi Lucca,


In the shared screen-shot, I found that you are using a ListRecord widget as the parent control; within which you are placing/defined the accordion widget.

I guess that the ListRecord widget Line Separator property is set to New Line (default value), because of that specified value it will automatically includes an <br> tag after every record.



Please change the Line Separator value of the parent ListRecord widget to None.



I hope by doing this change, it will solve the additional space issue.


Thanks & Regards,

Benjith Sam


Benjith Sam wrote:

Hi Lucca,


In the shared screen-shot, I found that you are using a ListRecord widget as the parent control; within which you are placing/defined the accordion widget.

I guess that the ListRecord widget Line Separator property is set to New Line (default value), because of that specified value it will automatically includes an <br> tag after every record.



Please change the Line Separator value of the parent ListRecord widget to None.



I hope by doing this change, it will solve the additional space issue.


Thanks & Regards,

Benjith Sam


Hello Benjith

Thanks for your reply, indeed i forgot to change the line separator of my list widget, now my problem is partially solved.

The real problem now is find a way to remove the white space between the title of the accordion-item and the accordion top and remove the space between the title and the content of the accorditon-item, any ideas? 


Solution

Well i found a way to "fix" this "problem", overwrite the accordion-item class with the padding attribute set to 0 

accordion-item .accordion-item-content.is--expanded {
    height: auto;
    padding: 0px;
    visibility: visible;
}


Solution