line-height 의 미스테리
Thursday, April 26, 2007 
IE 익스플로러에서 해더의 폰트 사이즈를 너무 크게하면 글자의 위 아래가 잘려 보이는 경우가 있다. line-height이 폰트 사이즈보다 작게 지정되어 있는 경우다.
line-height: 을 사용하여 잡아주면 문제없다. px보다는 단순 자연수를 사용하자. 나중에 폰트 크기를 조절할때 line-height은 신경쓰지 않아도 된다.
font-size: 40px; line-height:1;
line-height 은 40px이다.
폰트단위를 em 으로 사용때에도 같은 em으로 line-height을 잡아주기보다는 단위를 지정하지 않는것도 좋은 팁이다.
p.s. Ecto 에서 포스팅
Technorati Tags: explorer, ie, line-height, css, web standard, 폰트
신현석
April 26th, 2007 at 9:32 am 인용
예전에는 CSS validator 에서 단위 없이 값을 입력하면 validation에 실패를 하는 버그가 있었는데 최근에 고쳐졌군요. 이제 마음 놓고 단위를 빼고 사용할 수 있겠어요.
[Reply]
김진태
April 26th, 2007 at 9:53 am 인용
오 이거 정말 편하네요 좋은 팁 감사~
[Reply]
일모리
April 26th, 2007 at 10:41 am 인용
한가지 덧붙이자면 세로정렬이 필요할때 단순한 단어 한개정도라면 line-height을 써주면 편하게 정렬됩니다.
예를들어 30px 높이 칸 세로 중간에 Menu 단어가 위치해야 한다면 line-height:30px 을 주게되면 Menu 단어가 정가운데에 위치하게 됩니다.
신현석// 다 현석님 덕이지요. ^^;
요즘 validator랑 멀어지는거 같아서 걱정입니다.
김진태// 좋은 하루되세요
[Reply]
s
April 28th, 2007 at 12:11 am 인용
메뉴에서 글자를 vertical-align 중앙정렬을 할때 line-height를 쓰면 오히려 간단한데
padding-top과 padding-bottom으로 조절하는 경우를 종종봅니다.
[Reply]
일모리
April 28th, 2007 at 12:30 am 인용
line-height의 미스테리가 쉽지는 않습니다.
[Reply]