How to remove border of drop down list : CSS

Tags: css

Problem :

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. Please help me.

Solution :

The most you can get is:


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;}

    CSS Howto..

    How to change qunit theme / layout

    How to disable the collapsing feature in twitter bootstrap 3?

    How to rotate the background image in css?

    How do I keep dropdown menus the same width of top level categories with auto width

    show hidden div below current row of divs in responsive layout with jquery

    Can User-Agent affect how CSS is rendered on a page?

    How can I place three block of contents in one line in a way that the middle block is always full width?

    How do I get a div that appears on hover to overlap all others, without using absolute positioning?

    How to include materialize-css npm package with webpack

    How to align text and image in xslt with css

    drupal themes: how do I include several css files / js files on my theme's .info file?

    CSS - How to only apply a style to a div that is inside another div?

    HTML/CSS slight sideways scrollability, how to find source? [closed]

    How to set parent div height to self adapt to the inner div height?

    How make to flow around a triangular block?

    How to stop FOUC when using css loaded by webpack

    two divs in one div with img in each two, how to autoresize but keep row formation?

    How can I completely cancel a class when a CSS media style is used?

    HSS Liquid Layout Issue: how to fill the entire browser

    How to create a modal popup using javascript and CSS

    How to Add a Vertical Line inside a texbox using html and css

    How can I get this menu to hug the top of the page, widen out, and provide some space below it?

    How to stop JQuery Animate function from moving entire page

    How to add CSS stylesheet to aspx.vb table

    Dropdown not showing on small screens

    How to make div expand only from bottom down

    How to extend jQuery.css from plugin

    Show and hide img

    How to do Icon Prefixes on Select or Multi select Form elements using Material Design CSS?

    How to preload predefined images in Java-Script / jQuery?