html - 如何在页脚中显示垂直白色边框？

Question

我需要在页脚宽度的 90% 左右制作垂直白色边框。

它应该是这样的:

我目前的情况与图像相同，但右侧没有白线。

footer {
  width: 100%;
  background-color: #CDDE47;
  padding: 10px;
}

<footer>
  <h2>Contact us</h2>
  <p><em>You can find our physical location on:<br>
                42 Tree lane, CB2345, Cambridge, Cambridgeshire, United Kingdom</em>
  </p>

  <a href=""><em>+44 (2345) 345 456</em></a>
  <br>
  <a href=""><em><a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="432a2d252c0324312c342a372622372a376d202c6d3628" rel="noreferrer noopener nofollow">[email protected]</a></em></a>

  <ul>
    <li><a href=""><em>Check out our facebook page</em></a>
    </li>
    <li><a href=""><em>Check out our twitter feed</em></a>
    </li>
  </ul>
</footer>

Answer 1

给你的页脚position:relative并在其中添加一个div.verticalLine，定义如下:

.verticalLine{
    position: absolute;
    top: 0;
    right: 10%;
    width: 30px;
    height: 100%;
    background: #fff;
}