html – 表格宽度100%偏离一个像素(取决于实际宽度)

html – 表格宽度100%偏离一个像素(取决于实际宽度),第1张

概述我在另一个div内的div中有一个表.直接容器的宽度为40%,我希望表格与此div一样宽,设置宽度:100%. 相关标记 这在大多数情况下都有效,但是根据浏览器窗口的宽度,表格的宽度有时会偏离一个像素: 如右图所示,边框是兄弟div .info左侧的一个像素.这些边界应该对齐. 相关的CSS #userListContainer{width: 40%; float: left; }.info{d 我在另一个div内的div中有一个表.直接容器的宽度为40%,我希望表格与此div一样宽,设置宽度:100%.

相关标记

这在大多数情况下都有效,但是根据浏览器窗口的宽度,表格的宽度有时会偏离一个像素:

如右图所示,边框是兄弟div .info左侧的一个像素.这些边界应该对齐.

相关的CSS

#userListContainer{wIDth: 40%; float: left; }.info{display:block;line-height:22px; height:22px; padding-left:10px; }#userListContainer .info {border-right: 1px solID #999999;}.userList {    wIDth: 100%;     border-right: 1px solID #999999;    word-break: break-all; border-spacing: 0;    border-collapse: separate;}

对我来说似乎是一个渲染错误.它出现在Chrome 34.0.1847.131中,而不是IE10中.我无法在IE10或当前版本的firefox中重现它.

解决方法 错误在这里为我复制了Chrome.

我检查了元素,我注意到的是,表格框的宽度是217.443像素(显然是由于%宽度)

在inspect元素的HTML部分中,它将表的宽度定义为218 px,并将包含的div定义为217px ..

当我稍微扩展broswer窗口时,使桌面宽度增加到217.443像素,达到217.680像素,

HTML部分显示表宽度和包含div为218 px.

所以我猜测浏览器将像素四舍五入到最近的整个像素.

这可能是调查的正确途径吗?

编辑:试试这个,看看这是否适合你.我已经解决了这个问题(我认为)

http://jsfiddle.net/E2mUQ/3/

我只是删除了.table类的宽度,并将其与disPLAY:block相关联

总结

以上是内存溢出为你收集整理的html – 表格宽度100%偏离一个像素(取决于实际宽度)全部内容,希望文章能够帮你解决html – 表格宽度100%偏离一个像素(取决于实际宽度)所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: https://outofmemory.cn/web/1132624.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-30
下一篇 2022-05-30

发表评论

登录后才能评论

评论列表(0条)

保存