这是我的CSS代码
#wrap { width:50em; max-width: 94%; margin: 0 auto; background-color:#fff; } #head { width:50em; height:10em; max-width: 100%; margin: 0 auto; text-align:center; position: relative; } #css-table { display: table; margin: 1em auto; position: relative; width:50em; max-width: 100%; } #css-table .col { display: table-cell; width: 20em; padding: 0px; margin: 0 auto; } #css-table .col:nth-child(even) { background: #fff; } #css-table .col:nth-child(odd) { background: #fff; border-right: 4px double #b5b5b5; }
和我的HTML代码;
<div id="cont"> <div id="css-table"> <div class="col">123</div> <div class="col">123</div> </div> </div>
当我缩放Firefox窗口时,表格会缩小至300px宽度的视口,就像我想要的那样.但是在Chrome中,只有当视口宽于50em时,表格才会正常显示.如果我缩小了Chrome窗口,表格就会从包装的右侧出来.
是否有理由为什么Chrome这样做?
解决方法
原文地址:https://www.jb51.cc/css/214153.html
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。