Html 在容器中完全居中

我有一个无序列表，我想垂直显示它，并使它完全位于父容器的中心。我已经设法使它垂直显示，并以x轴为中心，但不以y轴为中心。“垂直对齐：中间”似乎不是我想要的

考虑以下html代码：

div{
保证金：自动；
宽度：90%；
高度：200px；
背景颜色：浅蓝色；
}
保险商实验室{
列表样式：无；
身高：100%；
宽度：100；
填充：0；
文本对齐：居中
}
ulli{
显示：内联；
右边距：20px；
垂直对齐：中间对齐；
}

清单项目1
清单项目2
清单项目3

要在y轴上垂直对齐，请将以下给定css添加到ul：

  display:flex;
  justify-content:center;
  align-items:center;

并删除

宽度：100来自ul标签

演示


div{
保证金：自动；
宽度：90%；
高度：200px；
背景颜色：浅蓝色；
}
保险商实验室{
列表样式：无；
身高：100%；
填充：0；
显示：flex；/*添加此*/
对齐内容：中心；/*添加此*/
对齐项目：居中；/*添加此项*/
文本对齐：居中
}
ulli{
显示：内联；
右边距：20px；
垂直对齐：中间对齐；
}


清单项目1
清单项目2
清单项目3

您可以对div使用
display:flex
，对ul使用
margin:auto
。并从ul中删除
高度
和
宽度
规则。这是工作表



清单项目1
清单项目2
清单项目3

div{
显示器：flex；
保证金：自动；
宽度：90%；
高度：200px；
背景颜色：浅蓝色；
}
保险商实验室{
保证金：自动；
列表样式：无；
填充：0；
文本对齐：居中
}
ulli{
显示：内联；
右边距：20px；
垂直对齐：中间对齐；
}
要垂直对齐，可以使用
行高。
在div标记中使用行高度而不是高度

div {
  margin: auto;
  width: 90%;
  line-height: 200px;  /*change this */
  background-color: lightblue;
}


div{
保证金：自动；
宽度：90%；
线高：200px；
背景颜色：浅蓝色；
}
保险商实验室{
列表样式：无；
身高：100%；
填充：0；
文本对齐：居中
}
ulli{
显示：内联；
右边距：20px；
垂直对齐：中间对齐；
}


清单项目1
清单项目2
清单项目3

我想你说垂直时是指水平。另外，
宽度：100无效。需要一个可能的副本，并且通过搜索找到了许多相同的问题。是的，谢谢你指出。在你的问题中发布你的代码，而不是jsFiddle。我会说使用行距是一种不好的做法。因为我们可能需要覆盖段落的行高/内容在父div下。
div {
  margin: auto;
  width: 90%;
  line-height: 200px;  /*change this */
  background-color: lightblue;
}