Admin
1
I need to remove the underline of Material UI Select list on hovering.
I tried https://codesandbox.io/s/nifty-rubin-6x9po?file=/src/Dropdown.jsx which removes the underline by default but when hovered, the underline still shown
i referred How to change Material UI input underline colour? and Removing underline style of autocomplete in react material ui component but both dealt with how to show, I entirely want to remove the underline from select list. Any help is appreciated, thanks :)
Add the disableUnderline prop to Select. Here's a modified version of your sandbox: https://codesandbox.io/s/disable-underline-xulxq?file=/src/Dropdown.jsx.
Related answers:
just add the disableUnderline prop to select component, you will no longer see the border-bottom:
<Select
labelId='demo-simple-select-label'
id='demo-simple-select'
value={user.status}
classes={{
root: classes.selectControl,
icon: classes.arrowDownIcon,
}}
disableUnderline
>
...
</Select>;