Issue
Flexbox align-items: center;
is not working.
.container {
display: flex;
justify-content: center;
align-self: center;
}
<div class="container">
<p>Lorem ipsum</p>
</div>
Solution
In the code snippet below, align-self
property is used instead of align-items
. If you keep align-items
and apply a height
to the container
you can see it working.
.container {
display: flex;
justify-content: center;
align-items: center;
height: 300px;
background: #ff0;
}
<div class="container">
<p>Lorem ipsum</p>
</div>
Answered By - Gibin Ealias
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.