ComboBox Height

[Benjamim Goulart Bessa]

Hi

What is the correct way to change the height of the CombBox, or any other input from you? I'm working with Angular Material and Syncfusion controls as well, I'm trying to making the controls look similar: dimensions and cores. Theme Studio didn't help me with this task, can you help me?

Thank you

[Berly Christopher]

Hi Benjamim, 

 

Greetings from Syncfusion support.  

 

We have not provided the support for set the height to the ComboBox component directly. If you want to set the height to the component, we suggest you to override the CSS styles to the wrapper of the component as per the application need. Please refer the below code example. 

 

[app.component.html] 

 

<ejs-combobox id='games' #local [dataSource]='sportsData' [autofill]='true' [fields]='localFields' [placeholder]='localWaterMark' 

                    [popupHeight]='height' cssClass="customClass"></ejs-combobox> 

 

[app.component.css] 

 

.e-control-wrapper.e-ddl.customClass{ 

    height: 50px; 

} 

 

 

Please find the sample from the below link. 

 

Sample Link: https://stackblitz.com/edit/angular-7jpzx3-vk6hvn?file=app.component.html  

 

To know more about our API, methods and events please refer the below API documentation link. 

 

API Link: https://ej2.syncfusion.com/angular/documentation/api/combo-box#cssclass  

 

Regards, 

Berly B.C

[Benjamim Goulart Bessa]

Berly, thank you for your reply.

There is some document with avaiable css classes for customization? 

[Sevvandhi Nagulan]

Hi Benjamim,  

 

The cssClass property is used to add the custom class to the wrapper of component and popup element. We have add the class name with your own. So that, we can customize styles using the class name. 

 

To know more about our API, methods and events please refer the below API documentation link.  

  

API Link: https://ej2.syncfusion.com/angular/documentation/api/combo-box#cssclass  

 

Regards,  

Sevvandhi N