Круги CSS без ширины и высоты? : Возможно ли это с помощью чистого CSS или нет?

Я могу превратить div в круг вот так:

.circle {
 background-color: rgba(0, 0139, 0139, 0.5);
 height: 200px;
 width: 200px;
 -moz-border-radius:50%;
 -webkit-border-radius: 50%;
 border-radius:50%;
}

<div class="circle"></div>
</div>

Но я должен указать ширину и высоту:

Я хочу отобразить три строки текста в DIV с "no -wrap", чтобы каждый из 3 сегментов текста имел собственную строку и не переносился.

Я хочу отобразить их в центре круга и расширить круг, чтобы он соответствовал строкам текста.

Текстовые строки будут извлекаться из базы данных через PHP, и их длина будет различаться.

Проблема в том, что метод, показанный выше, работает только в том случае, если указаны ширина/высота.

Возможно ли это, используя только CSS, используя проценты, или мне понадобится обходной путь JS.

Заранее спасибо.

10
задан web-tiki 21 October 2014 в 08:00
поделиться