How to remove border of drop down list CSS

Question

I want to remove the border that is coming just outside the drop down list  I am trying    select xyz option     Border  none      But does not work for me

User · Answer

This solution seems not working for me   select       border  0px      outline  0px      But you may set select border to the background color of the container and it will work

User · Answer

You could simply use   select       border  none      outline  none      scroll-behavior  smooth      As the drop down list border is non editable you can not do anything with that but surely this will fix your initial outlook

User · Answer

The most you can get is   select xyz      border 0px     outline 0px      You cannot style it completely  but you can try something like  select xyz     -webkit-appearance  button    -webkit-border-radius  2px    -webkit-box-shadow  0px 1px 3px rgba 0  0  0  0 1     -webkit-padding-end  20px    -webkit-padding-start  2px    -webkit-user-select  none    background-image  url    images select-arrow png        -webkit-linear-gradient  FAFAFA   F4F4F4 40    E5E5E5     background-position  center right    background-repeat  no-repeat    border  1px solid  AAA    color   555    font-size  inherit    margin  0    overflow  hidden    padding-top  2px    padding-bottom  2px    text-overflow  ellipsis    white-space  nowrap

User · Answer

select xyz     border 0px    outline 0px      Exact solution

User · Answer

You can t style the drop down box itself  only the input field  The box is rendered by the operating system     If you want more control over the look of your input fields  you can always look into JavaScript solutions   If  however  your intent was to remove the border from the input itself  your selector is wrong  Try this instead   select xyz       border  none

[css] How to remove border of drop down list : CSS

Examples related to css