CSS 공부 ( font-size 10px 이하 )

개발을 하던 중 font size가 특정 구간에 도달하면 더 이상 줄어들지 않는 상황을 발견했다.

 

일부 브라우저는 브라우저 설정으로 최소 폰트 사이즈를 지정하고 있어서 font-size를 css에서 수정하여도 크기가 변하지않는 경우가 있었다.

 

간단한 방법으로 이를 해결 할 수 있었다.

 

.font {
	font-size: 10px; // 10px이 최소 크키라고 가정
	zoom: 0.9; // 9px로 줄어든 것 처럼 보이는 효과가 있었음.
}

 

zoom을 이용하여 font-size 비율을 낮춰서 디자인에 맞게 수정할 수 있다.

zoom 비율을 잘 이용하여 반응형 제작에도 도움을 받을 수 있다.