如何在下列情況下將div內容對齊？

Question

我有一個div有兩個divs裏面如下。

HTML代碼：

<div style="margin: 20px auto;" align="center"> 
     <div style="float:left;"> 
      <input type="button" class="myButton" value="Add"/> 
      <input type="button" class="myButton" value="Modify"/> 
      <input type="button" class="myButton" value="Delete"/> 
     </div>   
     <div> 
      <form id = "country_form" method="post"> 
       <select id="country_name" name = "country_name" style = "position: relative;width:60px;" onChange="return country_change();"> 
        <option value="">Select</option> 
        <option value="India">India</option> 
        <option value="Australia">Australia</option> 
        <option value="Malaysia">Malaysia</option> 
        <option value="UAE">U.A.E</option> 
        <option value="Singapore">Singapore</option> 
        <option value="USA">U.S.A</option> 
        <option value="Bangladesh">Bangladesh</option> 
        <option value="Sri Lanka">Sri Lanka</option> 
        <option value="China">China</option> 
       </select>&nbsp; 
       <select id="country_port" name = "country_port" style = "position: relative;margin-left:5px;width:60px;"> 
         <option value="">Select</option> 
         <option value="Macau">Macau</option> 
         <option value="Ningbo">Ningbo</option> 
         <option value="Beijing">Beijing</option> 
         <option value="Shanghai">Shanghai</option> 
         <option value="Guangzhou">Guangzhou</option> 
         <option value="Shenzhen">Shenzhen</option> 
       </select>&nbsp; 
       <input type="hidden" value="yes" name="submit_value"/> 
       <input type="submit" class="myButton" value="Search"/>  
      </form> 
     </div> 
    </div> 

正如我做浮左到第一內部的div外層的div是要左畫面。

那麼如何讓它成爲中心。

請幫我使其能夠

的jsfiddle：DEMO

Answer 1

看看這有助於.........

<div style="margin: 20px auto; width:80%;" align="center"> 

http://jsfiddle.net/XNdJw/