채택완료

css border-radius 질문드립니다.

2021-07-08 (목) 15:39:17 2,116

안녕하세요

웹에서 원형 동그라미를 쓰려면

div {width:200px; height:200px}

border-radius:200px

이걸 쓰는데요

모바일에선 사이즈를 % 로 쓰게 되어서

div {width:25%; height:100%}

border-radius:100% 로 하게되면

원이 타원형이 되어 버립니다.

px로 쓰면 되긴 하지만  모바일 사이즈가 각각 달라서

정확한 값을 넣기가 애매하네요 ㅠ

혹시 방법이 있을까요..

|

답변 1개

채택된 답변
+20 포인트

div {width:25%; height:100%} 

부모의 높이가 얼마인지는 모르겠지만
넓이랑 높이가 다르면 당연히 직사각형이 되니 타원이되겠죠

height를 auto로 바꾸거나 width랑 똑같이 해줘야 정사각형으로 원이 되겟죠

답변을 작성하려면 로그인이 필요합니다.