Question

有没有办法让元素不会导致父溢出，但保持可见？让我澄清一下

以下面的方式将一个类似水印的徽标应用于页面。它应该部分位于主要内容之外（蓝色虚线）

我不知道设置元素背景的选项，因为它会在浏览器窗口水平调整大小时保持不变，所以我刚添加了<div>，其中徽标作为其背景和position:absolute相对于主要内容容器的必要偏移量。

以前，只要浏览器宽于W1，页面就不会获得水平滚动条。现在，在主要内容框之外添加了额外的“水印”元素，只要浏览器比W2

更窄，就会出现滚动条

有什么明显的东西我不见了吗？背景设置，或者可能是一个整齐的边距解决方法/

mockup

更新

Answer 1

请记住，元素的宽度大于实际的“宽度”，它包括填充＆amp;边距，如果你的div上有填充，则将“宽度”减去等量。

这有意义吗？如果你发布实际的css＆amp; HTML可能更容易给你一个更详细的答案

另外你不能将图像指定为实际body元素的背景并将其设置为居中吗？

我玩过代码并为您提供可能的解决方案。

组

body{overflow-x:hidden;}

然后添加

@media all and (max-width: 400px)
{
 body{overflow-x:auto;   }
}

一旦您的屏幕小于400px（div的宽度），您的溢出：隐藏将被覆盖，您将获得滚动条。

此时您可能还想减小水印的宽度。

Answer 2

不幸的是，仅仅因为你嵌套了＆＃34;水印＆＃34; div并定位它绝对不会使它在文档之外。如果您将其放在文档之外，页面将滚动（如您所见）。

对我来说，我想到的第一个解决方案是将水印移到＆＃34;内容＆＃34; div并将水印应用于其父容器。我猜你没有做到这一点，因为你需要它相对于＆＃34;内容＆＃34; div，但这是值得尝试的东西。

此外，它滚动的原因是文档已溢出。快速修复，但不推荐，是使用＆＃34; overflow-x：hidden;＆＃34;在＆＃34;内容＆＃34;的父容器上格。

由于您已删除了HTML的其余部分，以及某些修复程序，因此很难为您提供解决方案。如果您的结构在某些方面很复杂，则可能不适用。