问题标签 [text-justify]

我将该align-text: justify;属性应用于某些文本。问题是当我想将一个单词移到新行时，文本不合理。我该如何解决这个问题？

图片

当我使用此代码时

发布时出现此错误

请帮我

我正在尝试对以下数组进行文本对齐并将其转换为如图所示的聊天系统。到目前为止，我能够正确对齐，但我一直试图让它看起来像一个聊天对话

“1”、“2”表示用户和他们的消息，数组应确定对齐的交替顺序。宽度是一行的总宽度，用户宽度是用户在一行中可以采取的最大宽度。用户 1 左对齐，用户 2 右对齐。

到目前为止，我有以下代码：

这使它看起来像这样：

但是我怎样才能将其转换为以下内容：

我正在构建一个基本的利率计算器，但似乎无法让我的输入以我想要的方式显示。

我是 HTML/CSS/Javascript 的新手，由于缺乏参考，我感到很受限制，所以如果任何做法有点过时，请原谅我。

这是我的条目的基本代码：

这是我的CSS代码：

我已经尝试过 justify-content、align-items、flex ......我觉得我快疯了。

网站的视觉示例

我只是想让输入在右侧相互对齐，非常感谢您的时间/帮助！

我正在努力实现这一目标。

最终目标

但是当有超过 2 个项目或者它们真的很长时它们粘在一起，我怀疑它们部署的空间很小，所以它们的行为就是这样。我已经尝试了一些事情，但我没有找到解决方案。

最终会发生什么

这是 HTML* 的一部分（我正在使用 React）。“TextWrapper”基于 ul 标签，“Text”基于 li 标签。您可以在代码中进一步查看。

这是我正在使用的 CSS

我正在尝试制作自己的justify()- 方法，该方法将字符串和整数作为输入，并填充间距，以使字符串具有与给定整数相同的长度。我已经按照这个问题的答案去做了。

我希望我的代码能够像这样工作：

我的代码如下所示：

这给了我这个输出：

但我想要这个输出：

我知道 有while-loop问题，但我不明白如何解决它。感谢所有帮助！

如何在 React Native 中证明文本的合理性？除了 Webkit 解决方案之外，还有其他替代解决方案吗？