Search code examples
cssasp.nettwitter-bootstrapbootstrap-multiselect

How to make the caret in Bootstrap multiselect plugin to appear on extreme right and vertically centered


I am using this plugin in my asp.net web application project and the problem is that the caret in the dropdown appears very next to the option text. Currently chrome inspector gives me this path to the caret

.multiselect dropdown-toggle btn btn-default multiselect-selected-text caret

but any change there isn't working and I don't know how to get it to right via css. Any help would be appreciated greatly. Thanks!


Solution

  • Copying answer from this. Just extend Bootstrap's .caret class:

    .caret {
    position: absolute;
    left: 90%;
    top: 45%;
    }
    

    I answered it here because someone may just search it as multiselect bootstrap's plugin caret position solution. The original answer is linked and credit goes all to that guy.