How can I keep dropdown menus open while inspecting them in dev tools?
The dropdown menu is here: https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_select
I’d like to change the CSS of the dropdown elements in a <select> element in dev tools, but I can’t make the dropdown stay open.
You are viewing a single comment
You can't style options, as they're browser-dependent and there isn't an agreed standard. You'd have to use a replacement, which provides the functionality with other components.
Then, to keep it open, you should be able to toggle classes and states in the inspector. I'm Firefox, it's above the style inspector, labelled as .cls and :hov, I believe (I'm on mobile at the moment).
Read this comment. I can select the dropdown items with the Browser Toolbox and add CSS to them.
You can a bit, but that will be limited and will differ by browser. Look at something like this to do it: https://medium.com/@ross.angus/styleable-select-box-replacement-in-pure-css-and-semantic-html-1f38a400b285