如何在文本框垂直对齐的框中对齐文本中心

Question

我有一个Box和想要显示为垂直的文本，

我使用writing-mode : vertical-rl来对齐它，例如：

我正在尝试使文字居中：

使用text-align : center或justify-content : center，但无济于事

当前使用的CSS如下：

我也经历了其他一些SO Q，但没有任何效果

要求O / p：

• 框的大小是动态变化的，但是文本应该居中对齐（以获取任何填充建议）。.我想知道如何实现这一点..任何帮助，TIA

  

Answer 1

我认为您正在寻找align-items：

.sapMText {
  display: flex;
  box-sizing: border-box;
  writing-mode: vertical-rl;
  width: 200px;
  border: 1px solid black;
  line-height: normal;
  align-items: center;
  cursor: text;
}

Answer 2

将文本放入跨度标签<span id="text">text vertical ...</span>中，并赋予以下样式：

    #text {
writing-mode : vertical-rl;
margin-left: 50%;}