How to set height of cell editor based on content?

Question

I have this ag-grid table with the cellEditor agRichSelectCellEditor and I want the height to be set to the same size as content by default. In the picture attached I have space in the bottom of my agRichSelectCellEditor and I want the size of the editor to be the same size as content and remove the space in the bottom. with more than 4 options it works fine and there is no space in the bottom.

 cellEditor: "agRichSelectCellEditor"

This seems to be the standard in ag-grid cell editors, if you click on male in the cellEditor example in the official doc it seems to have empty space here too (See image below). Here is a link to ag-grid cell editor doc which includes an example of the table which has the same "issue": Cell editing Ag-grid-angular documentation

Plunker example of the case: Ag-grid agRichSelectCellEditor example

Is it possible to modify the default minimum height to depend on content size in ag-grid?

Added link to the official doc of ag-grid where there is an example of the same case and also the source code, — Filip Huhta
It would be very nice if your provide a stackblitz example as there is no TypeScript examples in link you provided — StepUp

StepUp StepUp · Accepted Answer · 2021-04-10T16:56:39

The following style should make height of list to fit to size of its content:

div.ag-rich-select .ag-rich-select-list {
    width: 100%;
    min-width: 200px;
    background-color: lightgreen;
    height: 100% !important;    
}

However, styles are not overriden. It looks like that styles should be overriden through some code like it is described in the docs or by adding the above class to style.scss file.

How to set height of cell editor based on content?

1 Answers