我试图垂直放置绝对没有运气的div的中心孩子。有人对此有很好的解决方案吗?(淘汰js)。
<div class="title">
<div>
<span>03</span>
</div>
<h2>
title
</h2>
</div>
CSS:
.title {
height: 100%;
position: absolute;
text-align: center;
width: 100%;
}
.title div,h2 {
//i want to center these two verical
}
一个现代的方法是这样的(我建议额外的div):
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
.title {
height: 100%;
position: absolute;
text-align: center;
width: 100%;
}
.title-inner {
position: relative;
top: 50%;
transform: translateY(-50%);
}
</style>
</head>
<body>
<div class="title">
<div class="title-inner">
<div>
<span>03</span>
</div>
<h2>
title
</h2>
</div>
</div>
</body>
</html>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句