We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

border for dropdown

Hi, under "overview" section, the dropdown list in this example has border on all four sides- https://www.syncfusion.com/angular-ui-components/angular-dropdown-list
But, I only see a bottom border when I use the dropdown component. How can I get all four borders?

1 Reply

SN Sevvandhi Nagulan Syncfusion Team November 26, 2019 01:32 AM

Hi Jose, 

Greetings from Syncfusion support. 

While checked the reported issue, icon background color is overlapped with the wrapper of the component. This is the already known issue in fabric theme on chrome browser. So, please use the below work around solution to get rid of the reported issue DropDownList component. 

    .e-input-group .e-input-group-icon, 
    .e-input-group.e-control-wrapper .e-input-group-icon { 
        background: none; 
    .e-input-group:not(.e-disabled) .e-input-group-icon:hover, 
    .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover { 
        border-bottom: 0.15px solid #767676; 
    .e-input-group.e-input-focus:not(.e-disabled) .e-input-group-icon:hover, 
    .e-input-group.e-input-focus.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover { 
        border-bottom: 0.50px solid #0078d6; 

Please find the sample from the below link. 

Sevvandhi N 

Live Chat Icon For mobile
Up arrow icon