css – How to centralize text vertically when there’s no overflow?
تبليغيرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.
margin-top: 4px;
border-radius: 16px;
overflow-y: scroll;
height: auto;
min-height: 64px;
max-height: 288px;
padding: 12px;
display: flex;
align-items: center;
justify-content: center;
}
<div class=”container”>
<p>Text goes here…</p>
</div>
I have this container that grows with the text up to a limit of 288px, but shrinks up to 64px when the text isn’t enough to fill the container.
The problem is: I want the small text to be vertically centralized in the minimum-sized container. This css does that. But when the text overflows, it’s still centralized, so part of it is hidden above the container and can’t be reached.
Screenshot for reference (it is impossible to scroll up):
screenshot of overflowing text
أضف إجابة