web sprit

일반적으로 가운데 정렬은 width 값이 존재하고 margin값을 margin:0 auto;를 주어 정렬하곤 합니다.하지만 width 값이 가변적으로 변경될 수 있다면 어떻게 정렬해야 할까요? 방법은 있습니다!!! 크게 2가지 방법을 알려 드리겠습니다.1. display:table12345678 .center-box{display:table; margin:0 auto; padding:30px; background:red;} .center-box .item{background:yellow;} contentsColored by Color Scriptercsex) 화면 contents 2. display:inline-block12345678 .center-box2{text-align:center; backgr..

display 의 inline-block 속성을 사용할때 가끔 크로스브라우징에 문제가 발생하곤 합니다.지금부터 그런 문제들의 대한 해결방안을 설명해 드리겠습니다. IE6 ~ 7 문제익스플로서의 낮은 버전의 브라우저에서 생기는 문제로inline태그에 inline-block 속성을 사용 : 이상없음block태그에 inline-block 속성을 사용 : inline-block을 block 속성으로 인식하는 버그12/* 해결방법 */.className{*display:inline; *zoom:1;}cs FF2 문제display:-moz-inline-stack 을 사용하여 해결.(이것보다 더 의미에 맞는 속성은 display:-moz-inline-box 속성 이나 -moz-inline-box 속성을 사용할 경우 ..

퍼블리셔라는 일을 시작한지 많은 시간이 지났지만 당연스레 생각했던 CSS Reset에 관해 좀더 심도있게 알아보려 합니다. 처음에 들어와서 누군가가 사용하던것에 이미 익숙해져있는 나로서 새로운 나만의 reset css를 만들어 보겠습니다. 우선 아래 참고할만한 사이트를 나열 하였습니다. 1. CSS Reset 종류1-1. Eric Meyer's CSS Reset1-2. html5doctor.com Reset1-3. Normalize.css 1.0 - GitHub (참고사이트 : http://webdir.tistory.com/455)1-4. Yahoo! (YUI 3) Reset CSS1-5. DAUM(Darum) Reset CSS(PC, Mobile reset css 제공) 2. 정리 CSS Reset위 ..