6

How can I style a drop down different when it is open or closed? Is there any pseudo selectors or tricks for that? of course with out javascript.

<select>
  <option> op1 </option>
  <option> op2 </option>
</select>

and :hover doesn't really suit my need because when the drop down is expanded, i can move the cursor away. it still is open but the :hover styling doesn't apply anymore.

mbehzad
  • 3,758
  • 3
  • 22
  • 29
  • possible duplicate: http://stackoverflow.com/questions/7208786/how-to-style-the-option-of-a-html-select – Michael Benjamin Jul 23 '15 at 14:50
  • @Wavemaster i'm not asking for the styling of a dropdown (select) in general but only if there is a selector for the "open state"! – mbehzad Jul 23 '15 at 15:00
  • 1
    Then the answer is simple: **no**. Without JavaScript, there is no "open state" selector. And I'm not sure if there's a way with js. – Wavemaster Jul 23 '15 at 16:26

1 Answers1

-3

Are you looking for :hover?

It's the state of an element if the mouse is over it.

a {
  color: blue;
}
a:hover {
  color: red;
  text-decoration: overline;
}
<a href="#">Move the mouse over me</a>
Wavemaster
  • 1,794
  • 16
  • 27
  • No. when it is expanded. e.g. i have when i click on a drop down it expands then i can move my cursor away and it still is expanded. and i would like the styling still be there. then when i click again and it collapses, then the styling should be reversed again. – mbehzad Jul 23 '15 at 14:44
  • You should write that in your question. Also you should provide the code you have already tried. – Wavemaster Jul 23 '15 at 14:45