html - 如何对齐两个 div 列之一

我在对齐两列的左列时遇到了一些问题。我希望它们以响应方式出现在页面中央。

这是我当前的代码:

    <div style="background: url('http://www.house-for-fast-cash.com/wp-content/uploads/2016/06/houses-background.jpg')">
<center><h2>WE BUY HOUSES Any Reason, Any Condition</h2></center>
<div style="width: 100%">
        <div style="width: 50%; float: left; display: inline-block; ">
          <ul>
            <li>Behind on taxes</li>
            <li>Behind in Payment</li>
            <li>Vacant / Vandalized</li>
            <li> Inheritance</li>
            <li>Expire Listing </li>
          </ul>
        </div>
        <div style="width: 50%; display: inline-block;">
            <ul>
              <li>Bad Tenant</li>
              <li>Facing Foreclosure</li>
              <li>Divorce</li>
              <li>Tired Landlord</li>
              <li>Fire Damage</li>
            </ul>
        </div>
    </div>
<center><h2><strong><a href="http://www.house-for-fast-cash.com/contact/">Get Me An Offer RIGHT AWAY!</a></strong><strong></h2></center>
</div>

提前致谢!

克莱尔

最佳答案

一种方法是这样的:

http://codepen.io/anon/pen/qNRpoo

如果你想让第一个列表沿着元素符号对齐，你必须把它放在一个额外的包装器中，你像这样制作 display: inline-block 并在其中对齐文本再次向左:

http://codepen.io/anon/pen/jryYxW

关于html - 如何对齐两个 div 列之一，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/38028142/