doe.2211 doe.2211 - 9 months ago 67
CSS Question

ionicons inside bootstrap 4 input

i would like to build an input search field with bootstrap alpha 4, but instead of glyphicon icons or font awesom, i'm using ionicons, i prefer them more.

the problem is that the icon is allways under the input field, how could i get it inside of the input field.

<div class="input-group">
<input type="search" class="form-control">
<i class="ion-ios-search-strong pulse-icons "></i>

enter image description here

Answer Source

Their u go

  <div class="col-xs-12">
    <div class="input-group filter-search">
      <input type="search" class="form-control" placeholder="Filter nach Namen...">
        <i class="ion-ios-search-strong pulse-icons"></i>

You dont have to set them specif on relative, inputs are most set to relative.

.input-group span {
  position: absolute;
  left: 0;
  z-index: 2;