Html 如何对齐一行中的div

参考下面的HTML，有四个DIV容器，每个容器包含一个图像、标题元素、段落元素和一个链接。当页面在全尺寸计算机显示屏上打开时，我希望三个div在屏幕上并排对齐

<div class="threeSpread">
    <div class="outer">
    <img src="imagesForNew/new1.jpg">
    <h2>CHININESE INVESTORS COME TO DETROIT</h2>
    <p>"the Shanghai-based developer Dongdu International (DDI) made its first move. In an online auction, it snapped up three iconic downtown properties, all built during the citys early 20th-century"</p>
     <a href="http://www.theguardian.com/cities/2014/jul/22/does-multimillion-dollar-chinese-investment-signal-detroits-rebirth">theguardian.com</a>
    </div>

    <div class="inner">
    <img src="imagesForNew/new1.jpg">
    <h2>CHININESE INVESTORS COME TO DETROIT</h2>
    <p>"the Shanghai-based developer Dongdu International (DDI) made its first move. In an online auction, it snapped up three iconic downtown properties, all built during the citys early 20th-century"</p>
     <a href="http://www.theguardian.com/cities/2014/jul/22/does-multimillion-dollar-chinese-investment-signal-detroits-rebirth">theguardian.com</a>
    </div>

    <div class="outer">
    <img src="imagesForNew/new1.jpg">
    <h2>CHININESE INVESTORS COME TO DETROIT</h2>
    <p>"the Shanghai-based developer Dongdu International (DDI) made its first move. In an online auction, it snapped up three iconic downtown properties, all built during the citys early 20th-century"</p>
     <a href="http://www.theguardian.com/cities/2014/jul/22/does-multimillion-dollar-chinese-investment-signal-detroits-rebirth">theguardian.com</a>
    </div>
</div>

到目前为止，它们只是垂直地堆积在屏幕上

<div class="threeSpread">
    <div class="outer">
    <img src="imagesForNew/new1.jpg">
    <h2>CHININESE INVESTORS COME TO DETROIT</h2>
    <p>"the Shanghai-based developer Dongdu International (DDI) made its first move. In an online auction, it snapped up three iconic downtown properties, all built during the citys early 20th-century"</p>
     <a href="http://www.theguardian.com/cities/2014/jul/22/does-multimillion-dollar-chinese-investment-signal-detroits-rebirth">theguardian.com</a>
    </div>

    <div class="inner">
    <img src="imagesForNew/new1.jpg">
    <h2>CHININESE INVESTORS COME TO DETROIT</h2>
    <p>"the Shanghai-based developer Dongdu International (DDI) made its first move. In an online auction, it snapped up three iconic downtown properties, all built during the citys early 20th-century"</p>
     <a href="http://www.theguardian.com/cities/2014/jul/22/does-multimillion-dollar-chinese-investment-signal-detroits-rebirth">theguardian.com</a>
    </div>

    <div class="outer">
    <img src="imagesForNew/new1.jpg">
    <h2>CHININESE INVESTORS COME TO DETROIT</h2>
    <p>"the Shanghai-based developer Dongdu International (DDI) made its first move. In an online auction, it snapped up three iconic downtown properties, all built during the citys early 20th-century"</p>
     <a href="http://www.theguardian.com/cities/2014/jul/22/does-multimillion-dollar-chinese-investment-signal-detroits-rebirth">theguardian.com</a>
    </div>
</div>

---

使

显示：内联块

div {
    display: inline-block;
}

工作示例：

否则,


div{
显示：内联块；
}
.三份{
保证金：0 40px 40px 40px
}
内分区，外分区{
最大宽度：30%；
}
@介质（最大宽度：568px）{
.外部img{浮动：左；
右边距：5px；}
.内部img（浮动：右侧；
右边距：5px；
)
h2{页边距顶部：50px}
}

中国投资者来到底特律
总部位于上海的开发商东都国际（DDI）迈出了第一步。在一次网上拍卖中，东都国际抢购了市中心的三处标志性房产，这些房产均建于20世纪初

中国投资者来到底特律
总部位于上海的开发商东都国际（DDI）迈出了第一步。在一次网上拍卖中，东都国际抢购了市中心的三处标志性房产，这些房产均建于20世纪初

中国投资者来到底特律
总部位于上海的开发商东都国际（DDI）迈出了第一步。在一次网上拍卖中，东都国际抢购了市中心的三处标志性房产，这些房产均建于20世纪初

将div类的显示键更改为

显示：内联块

也看看这个
将一行中的3个div与flexbox对齐：