텍스트를 일정 위치나 중앙에 넣고 싶은데요.

아래와 같이 해주니까

원안에 글이 써지는데요.

이걸 중앙(높이)에 위치하게 하고 싶은데

어찌해야 할까요?

조언 좀 부탁드립니다.

혹 원이 아닌 사각 라운드로 하려면 어찌해야 할까요?]

<ul class="list-inline div-ring">
        <li style="width:300px; height:300px;">
            <div class="ring-item bg-red">
            <h4 class="div-title-underline-thin border-white">믿음</h4>
                <p>내용<br></p>
            </div>
        </li>
        <li style="width:280px; height:280px;">
            <div class="ring-item bg-blue">
                <p>내용</p>
            </div>
        </li>
        <li style="width:300px; height:300px;">
            <div class="ring-item bg-orange">
                <p>내용</p>
            </div>
        </li>
</ul>