Question

我不完全确定我做错了什么，但是一些div的背景颜色并没有像我想要的那样扩展。这是一个演示

的小提琴

<body><div><pre style="background-color: red">A LOT OF CONTENT THAT OVERFLOWS</pre></div></body>

基本上我有一些带有溢出内容的div / pre块，我希望它们的背景颜色与它们所在的div的整个宽度相同。

谢谢！

Answer 1

只需从实际内容类

中删除此行

left: 0;
right: 0;

从正文中删除溢出：隐藏。

Answer 2

添加此CSS，我认为它将修复包装：

pre {
    white-space: pre-wrap;       /* Since CSS 2.1 */
    white-space: -moz-pre-wrap;  /* Mozilla, since 1999 */
    white-space: -pre-wrap;      /* Opera 4-6 */
    white-space: -o-pre-wrap;    /* Opera 7 */
    word-wrap: break-word;       /* Internet Explorer 5.5+ */
}

Answer 3

pre是块级元素，因此在这种情况下不会超出它的容器。如果您将显示样式交换为 inline-block ，那么您将获得溢出文本的背景。至少从我对小提琴的理解来看。

溢出内容背景颜色不扩展

3 个答案: