1

I am working on one of core component of HTML, select. Now I want to modify its drop down behavior. Mean dropdown height, scroll sytle etc.

enter image description here

Is there any way to override the default behavior of dropdown?

Thanks

P.S.
  • 15,970
  • 14
  • 62
  • 86
keepmoving
  • 1,813
  • 8
  • 34
  • 74
  • Possible duplicate of [Styling Select Drop down box](https://stackoverflow.com/questions/17516559/styling-select-drop-down-box) – Duannx Sep 23 '17 at 02:41
  • I think no, see in this example we do not have any control on scroll style, dropdown height. Is there any other thing that can done. – keepmoving Sep 23 '17 at 02:47
  • CSS can't style scroll bars for all browsers. Support is patchy, consider using an external JS / jQuery library for cross browser support. – I haz kode Sep 23 '17 at 03:00

1 Answers1

0

You can override select and option styles, for example:

select {
  background-color: yellow;
}

option {
  background-color: violet;
}
<select>
  <option>Option 1</option>
  <option>Option 2</option>
  <option>Option 3</option>
  <option>Option 4</option>
  <option>Option 5</option>
</select>

"I want to override the css for scroll bar, dropdown container height etc.". It seems like there is no way to do it in default HTML select element.

P.S.
  • 15,970
  • 14
  • 62
  • 86
  • Sorry to see, but this not the solution what I am looking for. I want to override the css for scroll bar, dropdown container height etc. – keepmoving Sep 23 '17 at 02:49
  • @StillLearning, I have updated the answer. It seems like there is no way to do it in default HTML `select` element. – P.S. Sep 23 '17 at 02:51