CODEWITHSUNDEEP
reactjsbootstrap-5
CasperTheGhost
CasperTheGhost

Reputation: 11

Set color of dropdown arrow on NavDropdown

I can't find a way to change the dropdown arrow color, I can set the color of the text and background.

Using the following code with CSS:

<NavDropdown
    className= {classes.dropdown}
    id="nav-dropdown"
    title= {<span className={classes.dropdownText}>Title</span>}
    >

    <Dropdown.Item href="#/action-1">
    {<Row style={{width: 227}}>
    <div class="col-auto">Item1</div>
    <div class="col-auto">Item1</div></Row>}</Dropdown.Item>
    
<Dropdown.Item href="#/action-1">
    {<Row style={{width: 227}}>
    <div class="col-auto">Item2</div>
    <div class="col-auto">Item2</div></Row>}
    </Dropdown.Item>
    
<Dropdown.Item href="#/action-1">
    {<Row style={{width: 227}}>
    <div class="col-auto">Item3</div>
    <div class="col-auto">Item3</div></Row>}
    </Dropdown.Item> </NavDropdown>

I've tried editing the original CSS lines packaged with bootstrap, but none of them seem to change anything

Upvotes: 1

Views: 630

Answers (1)

Kavitha K T
Kavitha K T

Reputation: 119

.dropdown>a::after {
    color: red;
}

add above css style will provide red color arrow

Upvotes: 1

Related Questions