在页脚内的同一行上无法获取div

Question

我正在为网站制作页脚，我需要它有多个部分，因此每个部分都有一个div。到目前为止，我已经得到了但是它们并没有相互对齐，如下所示：

Answer 1

footer {
  	height: 300px;
  	background-color: #EBEBEB;
  	width: 100%;
}
div#footer-wrapper div{ /* add this section of code */
  vertical-align : top; /* vertical alignment */
}
footer ul li {
  	font-family: 'Arsenal', sans-serif;
  	font-weight: 600;
  	font-size: 14px;
  	list-style-type: none;
}
footer h1 {
  	font-family: 'Arsenal', sans-serif;
  	font-weight: 600;
  	margin-bottom: 0px;
}
footer .footer-h1-wrapper {
  	width: 220px;
  	border-bottom: 4px solid #333;
}
footer #footer-wrapper {
  	margin-left: 150px;
  	height: 290px;
}
.footer-div {
  	display: inline-block;
  	margin-top: 50px;
}

<footer>
      <div id="footer-wrapper">
        <div id="footer-about" class="footer-div">
          <div class="footer-h1-wrapper"><h1>ABOUT US</h1></div>
          <ul>
            <li><a href="#/">FAQ</a></li>
            <li><a href="#/">Who We Are</a></li>
            <li><a href="#/">Terms of Service</a></li>
            <li><a href="#/">Shipping Policy</a></li>
          </ul>
        </div>
        <div id="footer-social" class="footer-div">
          <div class="footer-h1-wrapper"><h1>GET IN TOUCH</h1></div>
          <ul>
            <li><a href="#"><i class="fa fa-facebook-square fa-lg" aria-hidden="true"></i></a></li>
            <li><a href="#"><i class="fa fa-instagram fa-lg" aria-hidden="true"></i></a></li>
            <li><a href="#"><i class="fa fa-twitter-square fa-lg" aria-hidden="true"></i></a></li>
          </ul>
        </div>
      </div>
  </footer>