css 此元素导致Firefox中的元素溢出

jum4pzuy 于 2023-05-30 发布在其他

关注(0)|答案(4)|浏览(166)

我不使用Bootstrap或reset.css/reboot.css，我试图建立一个网站与通用的css。我正在做非常基本的事情，但我得到“这个元素导致一个元素溢出”字面上无处不在。我还没有做布局没有任何css框架相当长的一段时间，我找不到任何关于这个问题。即使是br也会导致溢出！这是什么？我没有看到任何的痕迹，一切看起来都和我期望的一样。这条信息太烦人了。

我检查了一点，发现图像导致了这一点。但我有

.img-responsive, .responsive {
    height: auto;
    max-width: 100%;
}
.img-thumbnail, .thumbnail {
    padding: 0.25rem;
    background-color: white;
    border: 1px solid #dee2e6;
    border-radius: 0.25rem;
    box-sizing: border-box;
}

如果我删除这张图片，溢出的消息将消失的几个元素下面。有谁能告诉我发生什么事了吗？

css

来源：https://stackoverflow.com/questions/70556531/this-element-is-causing-an-element-to-overflow-in-firefox

4条答案

按热度按时间

06odsfpq1#

这会有帮助的

html {
    width: 100%;
}

赞(0）回复(0）举报 2023-05-30

6yt4nkrj2#

MDN：
通过应用溢出创建滚动容器：滚动到容器或溢出：当有足够的内容导致溢出时自动。Firefox DevTools可以轻松发现可滚动元素和任何导致溢出的元素。
在HTML窗格中，可滚动元素旁边有滚动标记…
您可以切换滚动标记以突出显示导致溢出的元素，根据需要展开节点以使节点可见...
您还将在导致溢出的节点旁边看到一个溢出标记。
因此，如果容器的内容溢出，它将被标记为overflow，正如您所注意到的。调整内容物使其不溢出，或者调整容器本身使其允许内容物不溢出。您注意到的DevTools标记可用于识别哪些项溢出了哪个容器。

赞(0）回复(0）举报 2023-05-30

rslzwgfq3#

我建议在html中创建一个重置

/* ------------ Reset CSS ------------ */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  width: 100vw;
  height: 100vh;
}

赞(0）回复(0）举报 2023-05-30

ht4b089n4#

我也注意到我正在做的项目有类似的问题。看起来当你在任何浏览器中使用inspect时，由于Inspect控制台显示在HTML元素上而部分显示的HTML元素在该节点上被标记为溢出。由于您已经最大化了Inspect控制台，它覆盖了网页的所有元素，因此它们可能被标记为溢出。

赞(0）回复(0）举报 2023-05-30

我来回答

css 此元素导致Firefox中的元素溢出

4条答案

相关问题

热门标签

最新问答