Reputation: 16764
I created a simple application which uses bootstrap version 3.3.5 and a button with a dropdown:
<!-- Large button group -->
<div class="btn-group">
<button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
Large button <span class="caret"></span>
</button>
<ul class="dropdown-menu">
...
</ul>
</div>
If you run that on Safari iOS, the down
icon seems to be cut:
Is there a solution to this problem ?
Upvotes: 1
Views: 475
Reputation: 16764
I found the problem, that was made by caret
css class:
.caret {
display: inline-block;
width: 0;
height: 0;
margin-left: 2px;
vertical-align: middle;
border-top: 4px dashed;
border-top: 4px solid \9;
border-right: 4px solid transparent;
border-left: 4px solid transparent;
}
The following line I modified, from:
border-top: 4px dashed;
to
border-top: 4px solid;
and it works fine.
Upvotes: 4