无法更改“选择”元素的位置 (ASP.net)答案

【问题标题】：Can't change position of 'Select' element (ASP.net)无法更改“选择”元素的位置 (ASP.net)
【发布时间】：2014-02-18 00:29:08
【问题描述】：

我尝试使用 Bootstrap Dual Listbox ，来自这里：http://www.virtuosoft.eu/code/bootstrap-duallistbox/) 我的问题是双列表框总是左对齐，我不能改变它，我尝试将样式属性写入“选择”元素，并尝试链接到 css 文件，但没有任何效果。这是代码：

<body>

       <select  id="sele" multiple="multiple" size="5" name="listbox" class='demo2 col-md-3' style="text-align:center">

        <% for(int i = 0 ; i <50; i++){  %>
        <option value="<%=i %>" ><%=i %></option>
        <%  } %>

    </select>



    <script>
        var demo2 = $('.demo2').bootstrapDualListbox({
            nonselectedlistlabel: 'Select',
            selectedlistlabel: 'Selected',
            preserveselectiononmove: 'moved',
            moveonselect: false,
            initialfilterfrom: ''
        });
    </script>
    <script src="libraries/jquery-placeholder/jquery.placeholder.js"></script>
    <script>
        $('input').placeholder();
        prettyPrint();
    </script>
</body>

这是它的外观： http://oi57.tinypic.com/262up7r.jpg （而不是在中心）我该如何解决？

谢谢！！

【问题讨论】：

标签： javascript html asp.net css

【解决方案1】：

尝试将其包装在容器中，然后将其设置为居中对齐，如下所示：

<div style="width:100%; text-align:center;">
    <select id="sele" multiple="multiple" size="5" name="listbox" class='demo2 col-md-3'>
        ...
    </select>
</div>

【讨论】：

【解决方案2】：

将您的<Select> 包装在容器 div 中，并为容器 div 设置以下样式：

display: table; 
margin: 0 auto;

现在应该是这个样子

<div style="display: table; margin: 0 auto;">

    <select id="sele" multiple="multiple" size="5" name="listbox" class='demo2 col-md-3'>
        <!-- your stuff -->
    </select>

</div>

【讨论】：

嗨，元素向右移动，但仍未到中心，此外列表宽度发生变化..（我尝试将宽度改回来..但无济于事）看起来像这样：@987654321 @也许您有其他解决方案？谢谢！！