alignment issue with input append bootstrap

I have a btn-group that gives me an editable combox box. The only problem is that it's not aligned properly.

Here is the current box-

<div class="input-append btn-group form-control">
  <input class="input-sm span2" id="errorcount" size="16" type="text" value="Error">
  <ul class="dropdown-menu" id="dropdown-menu">
    <li><a href="#"><i class="icon-pencil"></i>less than 1,000</a></li>
    <li><a href="#"><i class="icon-pencil"></i>1,000 - 5,000</a></li>
    <li><a href="#"><i class="icon-pencil">                        
  </ul>
  <a class="btn btn-primary dropdown-toggle pull-right" data-toggle="dropdown" href="#">
    <span class="caret"></span>
  </a>
</div>

New changes

<div class="input-group">
                          <input type="text" class="input-sm" id="errorcount" size="" value="Error">
                          <div class="input-group">
                            <button type="button" class="btn btn-primary dropdown-toggle pull-right" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                              <span class="caret"></span>
                            </button>
                            <ul class="dropdown-menu dropdown-menu-right" id="dropdown-menu">
                              <li><a href="#"><i class="icon-pencil"></i>less than 1,000</a></li>
                                <li><a href="#"><i class="icon-pencil"></i>1,000 - 5,000</a></li>

                            </ul>
                            </div>
                    </div>