同一行中的两个文本一个对齐，另一个对齐

Question

I have a silly problem. 我有一个愚蠢的问题。 I want two texts to stay in the same line, but one text-align: left; 我希望两个文本保持同一行，但一个text-align: left; and the other one text-align: center; 另一个text-align: center;

What's the correct way to do that? 正确的方法是什么？

 .number{ text-transform:uppercase; letter-spacing:1px; text-align:left; display:inline; width: 50px; margin-top:-10px; float:left; font-size:18px; } .menutitle{ display:block; text-transform:uppercase; letter-spacing:1px; text-align:center; font-size:18px; margin-bottom:31px; }

 <span class="number">00</span><span class="menutitle">TEXT</span>

Answer 1

You can do this with Flexbox 您可以使用Flexbox做到这Flexbox

 .element { display: flex; } .menutitle { flex: 1; text-align: center; background: lightgreen; }

 <div class="element"> <span class="number">00</span> <span class="menutitle">TEXT</span> </div>

同一行中的两个文本一个对齐，另一个对齐

问题描述

1 个解决方案

解决方案1
1 已采纳 2016-03-01 13:15:55

同一行中的两个文本一个对齐，另一个对齐

问题描述

1 个解决方案

解决方案1 1 已采纳 2016-03-01 13:15:55

解决方案1
1 已采纳 2016-03-01 13:15:55