我正在为Google Chrome构建一个扩展，我注意到一个问题，在弹出窗口的底部和右侧有一条小白色。不知道什么可以在这里添加这个，因为我没有改变我的CSS中的任何地方的边距。
popup.html:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="../styles/popup.css" />
</head>
<body>
<div class="mainContainer"></div>
</body>
</html>popup.css:
:root {
font-size: 62.5%;
}
body {
font-size: 1.6rem;
background-color: #262b40;
}
.mainContainer {
width: 40rem;
height: 40rem;
}
3条答案
按热度按时间q8l4jmvw1#
这是因为你的显示器的分辨率是125%，我有同样的问题，但100%显示没有奇怪的线。这是一个bug，与HTML无关。我可能会尝试向Chrome报告，这有点烦人。
hfsqlsce2#
水平线和垂直线可以是滚动条。你可以指定容器的最大高度和最大宽度，这样它就会自动隐藏。
你也可以使用css属性来隐藏滚动条。
4nkexdtk3#
可能不是发生在我的扩展弹出窗口的同一个问题，但由于它似乎相关，我最终在这里寻找类似问题的答案，我将发布我的案例和解决方案。
我的popup.html中的代码基本上是一个包含所有内容的根div。此根div应用了深色背景色。它被不需要白色包围着。
以下是在我应用一些额外的CSS之前Chrome渲染的内容：
下面是我用来纠正这个问题的CSS：
这是它现在的样子：