关于网友提出的“CSS居中 一个CSS垂直居中的问题”问题疑问,本网通过在网上对“CSS居中 一个CSS垂直居中的问题”有关的相关答案进行了整理,供用户进行参考,详细问题解答如下:
问题:CSS居中 一个CSS垂直居中的问题描述:
父元素的高度不知道
子元素是一个类型为 a
的元素
样式大概是这个样子
这样子的话要怎么居中呢?
谢谢大家的解答啦~
解决方案1:
父元素不定高啊,line-hight 没法设,还有一个方法,父元素设置display: tabel-cell . vertical-align:middle. 也是没问题,,且兼容ie8+
解决方案2:line-height设置跟父层高度一样
解决方案3:position:absolute;
top:0;
bottom:0;
left:0;
right:0;
margin:0 auto;
提供两种方法参考
flex:
parent {
display: flex;
justify-content: center;
align-items: center;
align-content: center;
display: -webkit-box;
-webkit-box-pack: center;
-webkit-box-align: center;
}
transform:
a{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}