0

So I'm trying to change the background color on a dropdown menu.

http://www.vintageandretro.com.au/1940s-south-california-tourist-cushion/

Look at the quantity drop down. I want the background to be a different color. I tried changing the div.selector in the custom.css file but it still overrides it back to white.

div.selector {
  width: 200px;
  color: #444440;
  font-size: 14px;
  background: #000000 url(../../BrideToBe/images/theme/icon_arrow_down.png) no-repeat    right center !important;
  border: 1px dashed #d4d3d3;
  height: 28px;
  line-height: 28px;
  min-height: 28px !important;
  margin: -1px;
  padding: 3px 0 !important;`
}

To test, I've even removed the url to the arrow down icon, and it still appears. As if it is somehow being overridden.

Thanks!

DaniP
  • 37,813
  • 8
  • 65
  • 74
user3058518
  • 35
  • 4
  • This should help http://stackoverflow.com/questions/12836227/change-select-box-option-background-color – David Randall Jan 07 '14 at 16:31
  • although styling dropdown elements via css is very limited. I'd suggest considering some jQuery alternative, like jQuery Select2 or so.. – LorDex Jan 07 '14 at 16:36
  • I have changed color to black in the dom of your website and it worked `url("../../BrideToBe/images/theme/icon_arrow_down.png") no-repeat scroll right center #000000 !important` You don't even need `!important` rule – Morpheus Jan 07 '14 at 16:37
  • David, BigCommerce does a lot of its HTML through Snippets and such and so I can't directly reach the dropdown code. LorDex, I've thought about jQuery and I got it to work with the dropdown list, but not the actual box Morpheus, I can change it using Google's inspect but it won't do it if I edit the CSS..as if it's somehow being overridden. – user3058518 Jan 07 '14 at 17:37

0 Answers0