如何将下拉列表和表格元素放在页面中心?

极乐世界

margin:0 auto在div和表格上使用过,但下拉列表和表格显示在浏览器的左侧(在Chrome和Firefox中)。在IE中,表格位于页面的水平中心,但不在下拉列表的中心。

这是代码:

 <div >
        <select id="ddl" onChange="showTA()" style="margin:0 auto">
            <option value="none">Select Product</option>
            <option value="ib">IB</option>
            <option value="rs">RS</option>
            <option value="bp">BP</option>
        </select>
  </div>
  <div>
        <table id="selectBox" class="tables" 
                    style="display:none; margin:0 auto;">
                <tr class="header_rows">
                    <th>ID</th>
                    <th>HostOS</th>
                    <th>BuildID</th>
                    <th>Description</th>
                    <th>User</th>
                    <th>StartTime</th>
                </tr>
                <tr class="data_rows" ng-repeat='b in t1'>
                    <td class="tds">{{b.ID}}</td>
                    <td class="tds">{{b.HostOS}}</td>
                    <td class="tds">{{b.BuildID}}</td>
                    <td class="tds">{{b.Description}}</td>
                    <td class="tds">{{b.User}}</td>
                    <td class="tds">{{b.StartTime}}</td>
                </tr>
        </table>
  </div>

我想要的是,即使浏览器大小发生变化,它ddltable应该始终位于页面的中心。(我需要一个css解决方案。如果不可能的话,我也将接受Javascript),我也不想使用<center>标签。

马克·奥德(Marc Audet)

select默认情况下,您的元素是内联元素。要使用来居中margin: 0 auto显示,您可以将显示更改为阻止:

<select id="ddl" onChange="showTA()" style="display: block; margin:0 auto;">

table实际上已正确居中,除非样式表中有一些CSS规则引起冲突。

参见演示:http : //jsfiddle.net/audetwebdesign/eZHQZ/

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何将这些列表项放在页面底部的中心?

来自分类Dev

如何将这些列表项放在页面底部的中心?

来自分类Dev

如何将表格(两个下拉菜单和一个按钮)放在一行的中心

来自分类Dev

如何将表格移动到页面中心

来自分类Dev

如何将行和列放在节的中心

来自分类Dev

如何将表格放在窗口中心(设置表格位置)

来自分类Dev

如何将UIPageControl元素放在UIPageViewController的滑动页面顶部?

来自分类Dev

如何将容器放在列的中心?

来自分类Dev

如何将图像放在视图的中心?

来自分类Dev

如何将 ap 放在 div 的中心?

来自分类Dev

如何将按钮放在表格之外

来自分类Dev

如何将列表中心与 html 和 css 对齐?

来自分类Dev

如何将页脚放在页面底部?

来自分类Dev

如何将页脚放在页面底部

来自分类Dev

如何将div放在页面顶部

来自分类Dev

如何将标题放置在页面中心

来自分类Dev

如何将内容与页面中心对齐?

来自分类Dev

在Markdown中,如何将表格放在有序列表中?

来自分类Dev

如何将这些元素与中心对齐?

来自分类Dev

如何将文字放在内部div的中心?

来自分类Dev

如何将段落中心放在导航栏下方

来自分类Dev

如何将文字放在特定字符位置的中心?

来自分类Dev

如何将这 3 个按钮放在底部的中心?

来自分类Dev

如何将引导程序下拉列表添加到列表元素内的按钮

来自分类Dev

如何将集合视图和页面视图放在一个场景中

来自分类Dev

如何将文本移动到页面的顶部和中心?

来自分类Dev

如何将.jpg挂载到.pdf的中心(使用定义的页面大小和边框)?

来自分类Dev

如何将div放在表格单元格的底部?

来自分类Dev

如何将<div>放在表格标签中?

Related 相关文章

热门标签

归档