html 中的 li 偏移量错误

问题描述

我试图将 id="email-li" 的元素从我的 ul 中下移,但它没有下移。
我该如何解决
我有一个结构:

.contacts-info {
  width: 815px;
  max-height: 50px;
  text-align: center;
  margin: 50px auto 0px;
  display: inline-block;
}

li {
  display: inline-block;
  margin-left: 20px;
}

#email-li {
  margin-bottom: 20px;
}
<div class="contacts-info">
  <ul>
    <li><img src="assets/images/elaginDoorSmalllogo.svg"></li>
    <li id="email-li">E-mail:<br/>test@gmail.com</li>
    <li><img src="assets/images/pipe.svg"></li>
    <li>Hello1</li>
    <li><img src="assets/images/pipe.svg"></li>
  </ul>
</div>

解决方法

你可以使用

#email-li {
  position: relative;
  top: 20px; /*set how you need*/
  margin-bottom: 20px;
}