Css 当文本分成两行时调整行高

我有一个有文字的盒子。文本是动态添加的。它可以是一个单词，一个句子，也可以分成多行

但在框中，我最多只显示2行

框中的文本需要垂直和水平居中。这就是我的问题所在

到目前为止，文本是水平居中的，但不是垂直居中的。我试着使用display:flex，它解决了单行文本的问题，但在有两行文本时，它并没有给我想要的结果。我需要它来显示前两行

以下是我目前掌握的代码：

.项目{ 宽度：245px； 左边距：10px； 右边距：10px； 边框：1px纯灰； 高度：40px； 线高：20px； 溢出：隐藏； 边缘顶部：20px； 文本对齐：居中； } .flex{ 显示器：flex； 对齐项目：居中； 证明内容：中心； } 一些文本 一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字 一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字一些文字 尝试使用表格单元格属性进行垂直对齐

<div class="table">
 <div class="item cell">
    Some Text
 </div>
</div>

尝试使用表格单元格属性进行垂直对齐

<div class="table">
 <div class="item cell">
    Some Text
 </div>
</div>

试着用填充物，比如

.item {
  width: 245px;
  margin-left: 10px;
  margin-right: 10px;
  border: 1px solid grey;
  height: 40px;
  line-height: 20px;
  overflow: hidden;
  margin-top: 20px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top:10px;
  padding-bottom:10px;
}

试着用填充物，比如

.item {
  width: 245px;
  margin-left: 10px;
  margin-right: 10px;
  border: 1px solid grey;
  height: 40px;
  line-height: 20px;
  overflow: hidden;
  margin-top: 20px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top:10px;
  padding-bottom:10px;
}