Накратко
Формата зависи и от съотношението между ширината и височината.
Полезно е да знаеш
border-radius закръгля ъглите на кутията. При процентни стойности хоризонталният радиус се отнася към ширината, а вертикалният — към височината. Затова 50% върху правоъгълник дава елипса. [1]
За кръгъл аватар примерът е width: 80px; height: 80px; border-radius: 50%; object-fit: cover;. Равните размери са съществената част. Самото закръгляне не избира кадрирането на снимката и не премахва нуждата от смислен алтернативен текст. При бутон продълговатата форма може да е търсен резултат, а не грешка.
Източници
За повече подробности и проверка на информацията: