Проблема с адаптацией текста в блоке (чистый css)

Пытаюсь адаптировать текст в блоке на голом css.

html -

<div id="updates_container">
    <div class="updates_new">
        <p class="updates_text_top">
            Text
        </p>
        <div class="updates_text_center">
            TextTextTextTextTextTextTextTextTextTextTextText
        </div>
    </div>
</div>

css -

.updates_new
{
    background-color: #fafafa;
    border: 1px solid grey;
    width: 12em;
    height: 12em;
    margin: 2%;
    padding: 5px;
    border-radius: 10px;
    text-align: center;
}

.updates_text_center
{   
    overflow: auto;
    height: 50%;
}

Хочу сделать так, что бы текст был в эти 50%, заранее огромное спасибо, я новичок в css, только учусь