Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/461.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 在以下场景中,如何将div内容与中心对齐?_Javascript_Css_Html - Fatal编程技术网

Javascript 在以下场景中,如何将div内容与中心对齐?

Javascript 在以下场景中,如何将div内容与中心对齐?,javascript,css,html,Javascript,Css,Html,我有一个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" val

我有一个
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将在屏幕的左侧

那么如何使它成为中心

请帮助我使之成为可能


JSFIDLE:看看这是否有帮助

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


类似于这样的东西?您没有为包装器元素定义任何
宽度,也不要忘记清除浮动…css
边距:20px自动仅在div宽度小于100%时有效;如果不能设置div宽度,我认为唯一可能的情况是使用flexbox。但是flexbot只在ie11+上工作(ie10有bug)