CSS文本居中小技巧

我我的比较喜欢简单粗暴的上实际的结果的，因此，请看以下需求（其实很简单的，工做中一直有用到这种方法，就是没想着去写，而后看到其余人写了一些，我也把个人应用场景也写下，权当记录吧！）

看到这个弹窗了吗？一般咱们的弹窗里的内容文本都是居中的，那么问题来了，怎么保持短的时候居中，长的时候则据左呢？

这是在工做中会遇到的，对你来讲可能不是弹窗或者说是其它的东西。咱们解析下这个弹窗：

• 内容短，居中，text-align: center

• 内容长，居左，text-align: left

不写两套样式内容，怎么将两个text-align综合在一块儿？常作的话，估计看了前面的图也知道答案的了，看以下样式：

.container {
    text-align: center;
}

.content {
    display: inline-block;
    text-align: left;
}

知道了吗？看出什么了吗？ (。・∀・)ノ

来人，上代码 https://jsfiddle.net/lyplba/ye63j3e6/embed/result/

参考：aligning-text-smartly-in-css