rishi bhoi rishi bhoi - 1 month ago 26
CSS Question

add caret to select dropdown menu

here is the image I want to add a bootstrap caret class in my select dropdown menu.



.select_menu{
font-size: 12px;
outline: none;
border: thin #ddd solid;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
background-color: #F7F7F7;
}

<select class="form-control select_menu" style="">
<option>Click here to select purpose</option>
<option>Option 1</option>
<option>Options 2 </option>
</select>





I have used bootstrap form-control. How can I add caret to select dropdown menu.

Answer

Check out this answer - I think it will be right about what you're looking for.

The caret displayed in a <select> element is determined by the user's browser or OS. You can override this to set a custom caret/image; however, as described in the linked post, you risk diminishing the quality of experience on mobile devices.

Proceed with caution, good luck!