I really struggle with cssing my form and I am looking for help. I added my custom class name to the dropdown menu and I’d like to change it to look completely different.
While I actually can change the look of the select itself and background color of options, I cannot change paddings, margins etc. I would like to change hover’s background colour to orange from blue, use pointer inside the dropdown as well as on the select (which works now).
Hello Dawid. In addition to what Chris said about styling select elements, I would also encourage you to consider not making such a change. CSS is very cool, and it can be hard to resist the urge to use it just for the cool factor, but consider that many browsers and devices have default style settings for various elements based on best practices that were developed after many years of research into usability and accessibility. For example, I would have a difficult time with an orange background and I have my browser defaults set to a contrast that make it easier for me. If your stylesheet attempts to override my defaults, it would leave me cranky.
While I am a huge proponent of stylish forms I also believe that often simpler is better. I encourage you to seek to understand best style practices first before you decide what NEEDS to be changed, and keep all users in mind, even those with vision issues.