title: css bootstrap select move show tick mark to the left of text in dropdown menu
body: <p>Following the <a href="https://stackoverflow.com/questions/38806662/change-in-bootstrap-select-position-of-check-mark-or-glyphicon-ok-icon">question here</a>, I am trying to move the tick mark of the selector to the left of the option text. <br>
  Here is the example on the site:
  <a href="https://i.stack.imgur.com/nTqg1.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/nTqg1.png" alt="enter image description here"></a></p>
  
  <p>I tried to overwrite the css like this:</p>
  
  <pre><code>.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
      position: relative;
  }
  </code></pre>
  
  <p>changing it to a <code>relative</code> position, but no sucess.</p>
  
  <p>thanks in advance.</p>
  
  <h2>update</h2>
  
  <p>there is an example on the <a href="https://silviomoreto.github.io/bootstrap-select/examples/" rel="nofollow noreferrer">official website</a>:</p>
  
  <pre><code>&lt;select class="selectpicker show-tick"&gt;
    &lt;option&gt;Mustard&lt;/option&gt;
    &lt;option&gt;Ketchup&lt;/option&gt;
    &lt;option&gt;Relish&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <h2>updatea 2</h2>
  
  <p>here is my bootstrap-selecter css file looks like:</p>
  
  <pre><code>.bootstrap-select.btn-group.show-tick .dropdown-menu li.selected a span.check-mark {
    position: relative;
    display: inline-block;
    right: 15px;
    /*margin-top: 5px;*/
    left:2px;
  }
  .bootstrap-select.btn-group.show-tick .dropdown-menu li a span.text {
    margin-right: 34px;
  }
  </code></pre>