Bootstrap Vue - change dropdown background

Question

I'm using Bootstrap Vue plugin - https://bootstrap-vue.js.org/

I need to change dropdown menu default background when someone select value from dropdown like this.

But this is the problem. When someone click dropdown, They toggle "show" class in dropwdown wrapper. No any class new class for red color highlighted div.

I tried to style .dropdown-toggle class but it overrides default style only. Any solution?

.dropdown-toggle{
  background-color: #FF5722;
  border-color: #FF5722;
}

Jsfiddle

try setting the style for button instead of .dropdown-toggle — Annapurna
– Annapurna, Commented Feb 9, 2018 at 6:08
.show>.btn-secondary.dropdown-toggle {background-color: #FF5722} make sure your custom css is loaded after the buttons.scss file style — Annapurna
– Annapurna, Commented Feb 9, 2018 at 6:14
When someone click and select value, .show class removes from div. Then this is\n working. — Janath
– Janath, Commented Feb 9, 2018 at 6:16

Ismael Soschinski · Accepted Answer · 2020-03-15 01:31:20Z

0

You can do it directly in style. ex:

  <b-form-select
  options="[1, 2, 3]"
  style="background: red">
</b-form-select>

or create a class...

answered Mar 15, 2020 at 1:31

Ismael Soschinski

4753 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Shaik · Accepted Answer · 2018-02-09 06:15:51Z

-6

  <button type="button" class="btn btn-danger dropdown-toggle dropdown-toggle-split" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
      <span class="sr-only">Toggle Dropleft</span>

In the place of btn btn-secondary change button classes like danger,primary, etc.... for more information follow this link

https://getbootstrap.com/docs/4.0/components/dropdowns/

answered Feb 9, 2018 at 6:15

Shaik

3782 silver badges15 bronze badges

Collectives™ on Stack Overflow

Bootstrap Vue - change dropdown background

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related