如何在滑塊橫幅上創建搜索？

Question

代碼：

<section id="featured" class="bg"> 
    <div class="container"> 
     <div class="row"> 
      <div class="col-lg-12"> 
       <div id="main-slider" class="main-slider flexslider"> 
        <ul class="slides"> 
         <li> 
         <img src="<?php echo base_url(); ?>resources/img/1.jpg" alt="" /> 
         </li> 
         <li> 
         <img src="<?php echo base_url(); ?>resources/img/2.jpg" alt="" /> 
         </li> 
         <li> 
         <img src="<?php echo base_url(); ?>resources/img/3.jpg" alt="" /> 
         </li> 
        </ul> 
       </div> 
      </div> 
     </div> 
    </div> 
</section> 

<div class="col-lg-12"> 
    <input type="text" name="search" id="search" placeholder="search file"/> 
    <input type="submit" name="find" id="find" /> 
</div> 

在我的索引頁我這裏有三個圖像是由一個連續一個滑動滑塊旗幟。現在，我想在滑塊中間添加搜索欄，圖像可以滑動並且搜索欄應該被修復。我該怎麼做？請幫助我。

謝謝

Answer 1

把搜索DIV板塊內並使其絕對與相對部分

<section id="featured" class="bg"> 
<div class="container"> 
    <div class="row"> 
     <div class="col-lg-12"> 
      <div id="main-slider" class="main-slider flexslider"> 
       <ul class="slides"> 
        <li> 
        <img src="<?php echo base_url(); ?>resources/img/1.jpg" alt="" /> 
        </li> 
        <li> 
        <img src="<?php echo base_url(); ?>resources/img/2.jpg" alt="" /> 
        </li> 
        <li> 
        <img src="<?php echo base_url(); ?>resources/img/3.jpg" alt="" /> 
        </li> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div> 
<div class="col-lg-12 search_outer"> 
<input type="text" name="search" id="search" placeholder="search file"/> 
<input type="submit" name="find" id="find" /> 
</div> 
</section>