为什么文本对齐文本不会在div中？

Question

在a中对齐文本div是通过完成的text-align.它通常工作正常:

<div style="text-align:right;border:1px solid red">
  this goes to the right
</div>

我有一段代码(在vue.js的帮助下生成的大型HTML中间),其中未应用对齐.我强制a的宽度,div并希望其中的文本与右边对齐:

有足够的空间可以8:00向右移动,但它保持居中.CSS堆栈没有显示此元素的任何特殊内容:

这种对齐(或缺乏)的原因是什么？

注意:我没有包含整个HTML/SCSS代码,因为它有很多 - 希望CSS堆栈足够吗？

Answer 1

既然你在display: flex这里使用,text-align将无法正常工作.更改

div {
 justify-content: space-around;
}

至

div {
 justify-content: flex-end;
}

编辑:作为@Jacob灰色的通知,将display: flex在div元素不是一个好主意.最好从您需要的地方删除此属性div并使用text-align它