css - 如何填充form.well的宽度？

Question

这是我的问题的例子jsfiddle

<form class="well form-inline">
  <div class="input-append">
     <input type="text" class="input-block-level"><span class="add-on"><i class="icon-search"></i></span>
  </div>
</form>

您可以看到搜索按钮超出了容器。如何在不设置固定宽度的情况下解决此问题？

Answer 1

用于定位

    .input-append{position:relative;}
.input-block-level{position:relative;z-index:1;}
.add-on{position:absolute;right:0;top:0;z-index:2;}

Demo