Inflearn Community Q&A
asked
vw 사용 시 글씨 밀림 문제
Written on
·
500
0
안녕하세요, 선생님.
강의를 듣던 중 mid-message에 vw값을 주고
브라우저를 일정 크기 이상 키우면 사진과 같이 글자가 커지다가 밀려서 내려가는 현상이 발생합니다.
폰트 사이즈에 상한선을 걸 수 있을까요?
javascript웹 디자인HTML/CSS인터랙티브-웹svg클론코딩
Answer 1
1
studiomeal
Instructor
미디어 쿼리로 디자인에 맞게 폰트 사이즈를 조정해주시면 됩니다.
예를들어 기본적으로는 .foo 요소의 폰트사이즈를 10vw로 하고
브라우저 폭이 600픽셀 이하가 되면 40px로 고정한다면 아래와 같이 하면 되겠지요~
반대로 하시려면 max-width 대신 min-width를 쓰시면 되고요.
.foo {
font-size: 10vw;
}
@media (max-width: 600px) {
.foo {
font-size: 40px;
}
}
감사합니다, 선생님!