我有一个 div 需要居中 - 但使用
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
将div中的所有内容模糊。我知道这个问题在这里已经被问了很多次,但是4或5篇帖子中的解决方案都没有对我起作用。是否有任何当前的解决方案,甚至是另一种正确居中div的方法?
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
将div中的所有内容模糊。我知道这个问题在这里已经被问了很多次,但是4或5篇帖子中的解决方案都没有对我起作用。是否有任何当前的解决方案,甚至是另一种正确居中div的方法?
display: flex; align-items: center; justify-content: center;
来使子元素居中。
div {
background: black;
color: white;
width: 100px;
height: 100px;
display: flex;
justify-content: center;
align-items: center;
}
<div>
<span>centered</span>
</div>
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
position:absolute;
然后会起作用