CODEWITHSUNDEEP
htmlcss
rimi
rimi

Reputation: 775

changing the background color of drop down box

I am editing a web site written by a previous employee who is no longer with the company, I am asked a add a drop down box on the web site. Adding a drop down is very simple, but the background color of that drop down is always grey, although when I put the drop down on a notepad and save it as html then the background appears white in the browser. I did the entire style sheet search for select option, but could not find anything that turns the drop down box grey color, there are tons of style sheets and javascript file references in the code. I am very new to CSS. I decided to put my own stylesheet to overwrite that grey color , the background color of drop down box changed to white color, the color that I wanted, but the edges and the drop down sign is still grey. Is their any way, I can force the while color background on drop down box without changing the style sheet. Below is my code and style sheet and the image of the drop down:

<div class="ui-block-b ui-margins" > <label for="nname">Gender</label>

<select id="nname" class="specialcolor">

      <option  value="Male">Male</option>

      <option  value="Female">Female</option>

    </select>

</div>

style sheet is :

<style>

  .specialcolor{

background-color:white !important;

}

</style>

This is the image:

enter image description here

As you can see the internal drop down area is white otherwise rest is grey. I want the area totally white. Any help will be greatly appreciated.

Upvotes: 0

Views: 1339

Answers (1)

Anjali
Anjali

Reputation: 2698

You can click on the element, drop down box in your case and press F12 and look for developers tools. In developers tool, you can inspect that element and know the style sheet that is getting applied to the drop down box. For more information see this link:

https://www.hostinger.com/tutorials/website/how-to-inspect-and-change-style-using-google-chrome

Upvotes: 1

Related Questions