{webkini_blog;}

원문 : http://sixrevisions.com/css/10-random-css-tricks-you-might-want-to-know-about/ 원문을 해석한게 아니라 제가 그냥 이해한대로 요역해서 정리 했습니다. 1. em 을 쉽게 쓰기 위한 body 스타일body { font-size:62.5%; } p { font-size:1.2em; } body 에서 font-size를 62.5%로 세팅하게 되면 em값을 px값처럼 쉽게 매치 시켜 쓸 수 있습니다. body 세팅후에 font-size값은 1em = 10px, 1.2em = 12px 이런 식으로 사용가능해 집니다.(미확인) 2. webkit계열 브라우저의 입력폼 외곽선 없애기 크롬이나 사파리 등을 사용하면 입력폼 외곽에 포커스 되면 유색 외곽..

크로스 브라우징, 혹은 특정 브라우저에서 사용할만한 CSS 팁. 1. inline block inline-block 이 듣는경우 float를 사용하지 않아도 되고, 리스트 구성에 큰 도움이 된다. 근데 아직 필요한 경우가 없어서 이 코드는 확인 못해봄. This is awesome 2. 사파리 textarea 리사이즈 막기 사파리나 크롬의 경우 textarea가 리사이즈 가능하도록 나온다. 이때 사용하면 좋을듯. (확인했음!) / * Supports: car, both, horizontal, none, vertical * / textarea { resize: none; } 3. 라운드 코너(FF/Safari only) IE는 해당사항 없다. .rounded{ -moz-border-radius: 5px; ..

태그를 쓰는 경우 리스트 내용을 가로로 혹은 붙여서 표시해야 되는경우에 스타일에 float:left 를 주는 경우가 있는데 이때 몇가지 문제가 발생한다. 이에 대한 해결책은? 1. FF 3, Opera 9 에서 생기는 문제 레이아웃 스타일을 잡고 에 float:left 스타일을 설정하면 원래 이런 모양을 기대한다. IE 계열(6,7버전)에서는 다음과 같이 나온다. 하지만 FF, Opera에서는 다음과 같이 나온다. 보이는 것처럼 ul 높이가 없이 이상한 모양을 보여준다. 이때는 ul 태그에 overflow:auto나 overflow:hidden 스타일을 주면 고칠수 있다. 2. IE 6 문제 IE 7 이후로는 FF와 거의 비슷할 정도로 웹표준 혹은 호환성을 가지고 있다. 하지만 이전에 버전이 IE 6는 ..