在另一側展開搜索欄？

Question

我有這個演示：https://jsfiddle.net/064rmfat/。我想要的是，當用戶懸停搜索擴大搜索欄，但在左側。任何建議？

<div class="box"> 
    <div class="container-2"> 
     <span class="icon"><i class="fa fa-search"></i></span> 
     <input type="search" id="search" placeholder="Search..." /> 
    </div> 
</div> 

Answer 1

反向您浮動

.container-2 input#search { 
    float: right 
} 

https://jsfiddle.net/064rmfat/1/