javascript - 如何在以下情况下将 div 内容对齐到中心？

Question

我有一个 div，里面有两个 div，如下所示。

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/