CSS:在 chrome 中有 100% 宽度的问题

标签 css

要使 100% 宽度困惑的元素出现:单击两个六边形并将浏览器最大化。

#playerTwo，右侧部分，有一大块出现在浏览器的右侧，即出现滚动条。

我知道浏览器中的百分比宽度存在一些问题，我找到的解决方案之一是将边距和填充设置为 0px，但没有帮助。

*我之所以使用百分比，是因为我计划最终使页面响应。 =\

最佳答案

这是因为您在 #playerone、#playertwo 上有 width:500px，在 .nameslider 上有 width: 40% ，并且您在 #playerTwo 上没有 position:relative，因此它的宽度是根据文档的宽度计算的。

所以要修复它，您可以尝试将 position:relative;overflow:hidden; 添加到 #playerone, #playertwo 并设置 width 对于 .nameslider 到 100%。

或者也许只是多做一些实验 — 您的标记中有很多地方需要改进 :)

关于CSS:在 chrome 中有 100% 宽度的问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/7052630/