ci_lover
ci_lover

Reputation: 718

How to remove arrow from dropdown in Bootstrap

I'm trying to remove arrow from dropdowns. I want to show triangle_span instead with 2 glyphicons - triangles. How to do that? My code is:

  <div class="form-group">
<label>Labeling:</label>
                                   
                                    
<input type="hidden" id="unique_index" value="0" />
<select name="labeling[]" id="labeling" class="dropdown" >
<option value=''" . set_select('labeling', '') . " role='menuitem'> </option>
<option value="1" <?php echo set_select('labeling', '1'); ?> role="menuitem">1</option>
<option value="2" <?php echo set_select('labeling', '2'); ?> role="menuitem">2</option>
</select>
 <span  id="triangle_span" >  
<span class="glyphicon glyphicon-triangle-bottom"></span>
<span class="glyphicon glyphicon-triangle-top"></span>
</span>
                             
 </div>

Upvotes: 0

Views: 2249

Answers (1)

peszo
peszo

Reputation: 429

You can check this css:

select {
   appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   text-indent: 1px;
   text-overflow: '';
   background: url("custom image") no-repeat right center;
}

select::-ms-expand {
    display: none;
}

Upvotes: 2

Related Questions