html - 布局问题 - 页脚与图片冲突

Question

我最初认为这个问题与 bootstrap 相关，因为在我的前端离开之前他说他使用了 bootstrap 但 float clear 似乎没有修复它或者我只是迷路了。原来是这样

这是CSS

     .container {
    position: relative;
    max-width: 1200px;
  }
  .content-overlap {
    background: rgb(245, 244, 239);
    width: 40%;
    position: absolute;
    top: 80px;
    padding: 60px;
  }

  .content-overlap-right {
    background: rgb(245, 244, 239);
    width: 40%;
    position: absolute;
    bottom: 80px;
    right : 0px;
    padding: 60px;

  }
  .content-overlap:before {
    content: "";
    border: 2px solid rgba(171, 154, 124, 1.0);
    position: absolute;
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;
  }

  .content-overlap-right:before {
    content: "";
    border: 2px solid rgba(171, 154, 124, 1.0);
    position: absolute;
    top: -10px;
    left: -10px;
    right: -10px;
    bottom: -10px;

  }
  .image-overlap {
    width: 70%;
    float: right;
  }

  .image-overlap-left {
    width: 70%;
    float: left;
  }
  @media screen and (max-width: 480px) {
    .content-overlap {
      position: relative;
      width: 100%;
    }
    .image-overlap {
      width: 100%;
    }

    .content-overlap-right {
      position: relative;
      width: 100%;
    }
    .image-overlap-right {
      width: 100%;
    }
  }

.footie {
    background: black;
    color: wheat;
    bottom: 0%;
    width: 100%;
}

这是html

    `<div class="container">
  <div class="content-overlap">
    <h2>Contact Us</h2>
      <p> For investment information call: <br>
        +number or +NUMBER <br> <br>
          For legal contact:+NUMBER <br>
          For partnership: +NUMBER <br>
                  </p>
  </div>
  <div class="image-overlap">
    <img src="assets\administration.jpg"  >
  </div>
</div>

`

我认为这可能与定位有关，但我不知道如何使它看起来一样。

我只想让页脚不与“联系我们”文本框发生冲突。

现在它要求我添加详细信息，但我没有更多要添加的内容。我昨天真的问过这个，但我给出了错误的上下文，因为我得到了错误的上下文)

页脚应该在底部呈现为部分，而不是碰撞。

Answer 1

事实证明我的页脚在布局中 - 没有简单的方法来设置样式表来单独影响它(因为任何样式表都会影响看起来所有的布局)所以我最终设计了底部边距因此，前一个元素将整个事情推低了。

谢谢大家的帮助。