JavaScript olmadan toplam yükseklik yarısına eşit sınır yarıçapı yapmak mümkün mü?

Question

Bir web sitesi yapıyorum ve mockup, her biri yarım daire şeklinde belirli bir öğenin sol ve sağ uçlarını çağırıyor. Unsurlar, metinde ne kadar metin olduğuna bağlı olarak farklı yüksekliklere sahip olacağından, bunun bir şekilde sınır yarıçapını elemanın toplam yüksekliğinin yarısına eşit olarak alması gerektiği anlamına geldiğini biliyorum. JS kullanmadan bu mümkün mü?

Answer 1

Kesinlikle - border-radius'u büyük bir boyuta ayarlayın!

#some-element { 
    border-radius: 9999px; 
} 

Dairesel köşelere izin veren maksimum boyutta toplanır. Öğeniz geniş olduğundan daha uzunsa, öğeyi genişletmeden iki tarafın da yarım daireler olamayacağını unutmayın.