html - 两列在有空间时平行，在没有空间时彼此居中

我试图将一些html和css放在一起，使它像这样发生：

我有左右两段文字。有房间时，我希望左侧文本左对齐，而右侧文本右对齐。没有房间时，我希望左侧居中于右侧。像这样：

-----------------------------------------------------
Left block of text         Block of text on the right

-----------------------------
     Left block of text
 Block of text on the right

捕获：这是一封电子邮件，我希望它能在GMail中工作，据我所知，它没有给我任何使用媒体查询的方式。

我试过了

<div style="float: left; text-align: center">Left block of text</div>
<div style="float: right; text-align: center">Block of text on the right</div>

这适用于“宽”情况，但是在狭窄的窗口中

Left block of text
    Block of text on the right

居中只是不起作用。我试图以我能想到的所有方式设置width和max-widths，但我无法提出一些可行的方法。

有什么有用的想法吗？

最佳答案

js.fiddle

#right{
    text-align: right !important;
}

div{
    border: 1px solid #000;
    display: inline-block;
    vertical-align: top;
    text-align: justify;
    width: 49%;
}

这是您想要的吗？

关于html - 两列在有空间时平行，在没有空间时彼此居中，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22853254/