Question

我有一个带有重复图像的容器，我想填充100％的可用高度。一些内部div具有：在伪元素绝对定位后，我可以按照我需要的方式获得边界。这导致主容器的重复背景出现问题。

请访问此链接并滚动到页面末尾 - http://www.mariage-graham-audrey.com/static.html

有人可以为此建议一个可能的解决方案吗？

Answer 1

只是一种解决方法，但尝试添加更大的底部填充到这样的布局：

.layout {
  ...
  padding-bottom: 180px;
}

Answer 2

请用此替换布局div的样式。它会起作用

＆＃13;

.layout{
  background: white url("/bootstrap/assets/images/pattern.png") 0 0;
  width: 100%;  /* add 100% width*/
  margin: 0 auto;
  padding: 0 0 150px 0;  /*change padding with this*/
  min-height: 100%;
}

＆＃13;

Answer 3

刚刚看到你的CSS，我想通过添加这个你可以得到一个完整的页面背景：

  background: white url("/bootstrap/assets/images/pattern.png") 0 0;
  width: 100%;
  margin: 0 auto;
  padding: 30px 0;
  min-height: 100%;

只需编辑“width：100％;”即可。

css重复背景高度和绝对定位

3 个答案: