1

In select I had more options so scroll is appearing I am trying to access default scroll and change the style of scroll.

select::-webkit-scrollbar {
 width: 7px;
}
select::-webkit-scrollbar-track {
 background: #fff;
}
select::-webkit-scrollbar-thumb {
 background: #ccc;
 border-radius: 30px;
}
.selectfield::-webkit-scrollbar {
 width: 7px;
}
.selectfield::-webkit-scrollbar-track {
 background: #fff;
}
.selectfield::-webkit-scrollbar-thumb {
 background: #ccc;
 border-radius: 30px;
}


and the html code is as below:

    
<table class="form">
 <tr>
  <td>
   <select name="select" ng-options="item for item in items" ng-model="filter.item" class="selectfield">
    <!-I want to access this scroll->
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
    <option value="">-Select-</option>
   </select>
  </td>
 </tr>
</table>

I want to access this select scroll bar?

  • And need to change the default scroll styles?
  • Is it possible?
  • Thank you in advance
Krishna
  • 11
  • 3
  • Does this answer your question? [How do I style a – Jeremy Harris Jan 07 '20 at 13:29

2 Answers2

1

Use this plugin in your project this is specially for dropdowns then all css in your control.

Select2

Rameez Bukhari
  • 486
  • 2
  • 6
  • Hi, See the above snippet on the select dropdown click u can see options opening, with scroll bar !, I want to change the scrollbar styles. On the above URL how the scroll bar is there for body, I am trying to do same on dropdown scroll with only HTML & CSS – Krishna Jan 08 '20 at 05:26
  • Hi @Krishna if you want to apply styling on your scrollbar so use this plugin this is fully support for corss browsers and other scrollbar css and kits are not supported on cross browsers . All documentations is available in this link. http://manos.malihu.gr/repository/custom-scrollbar/demo/examples/complete_examples.html – Rameez Bukhari Jan 08 '20 at 06:10
0

I guess your intention is to style the select tag. Try this https://css-tricks.com/styling-a-select-like-its-2019/

Michał Droździk
  • 324
  • 1
  • 3
  • 10
  • Hi, See the above snippet on the select dropdown click u can see options opening, with scroll bar !, I want to change the scrollbar styles. On the above URL how the scroll bar is there for body, I am trying to do same on dropdown scroll. – Krishna Jan 07 '20 at 16:32