html - 列表项内的搜索栏

Question

我正在尝试在列表项中设计一个搜索栏。

 <li id="searchArea" style="width: 400px; float: none;">
 <span>     

  <img src="/ProfiletenModified/Images/searchicon18x18.png" style="
    height: 22px;
    margin-top: 5px;
    width: 22px;

    float: left;
  ">

  <input id="searchtextbox" type="text" autocomplete="off" style=" 
    border: 1px solid #fff;
  ">

  <span></span>
</span>
</li>

但问题是图像看起来离输入很远。他们都不太适合彼此。这个怎么做？

Answer 1

正如 GCyrillus 所说，您需要使用float: left.

看到这个小小提琴：http: //jsfiddle.net/jdevfox/645qH/3/

全部没有——我的<spam>意思是<span>标签。;)