WEBPI's Markup && Css Developer

이 버그는 border-collapse에 관한 버그인듯한데요 ------- 모질라 포럼 질문 내용---------------------------------- 111 1111 IE에서는 제대로 나오는데 FF3에서는 border-collapse를 먹은 table은 상단의 2px을 잡아 먹어버립니다. 즉 위치가 -2px이 되어버리더군요 FF3은 안써서 몰랐는데 아는분의 도움요청으로 테스트를 해본결과 이러한 버그가 발생했습니다. 해결방법은 table에 display: block;를 주는걸로 해결을 하셨다고 했는데 영찜찜해서요 --------------------------------------------------------------------- 해당 스크린샷입니다. 서정민's Website출처 : http..

IE6 : CSS Multi ‘id/class’ Bug IE6에서 발생하는 ‘다중 선택자 버그‘ 입니다. 하나의 아이디와 여러개의 클래스를 교차 조합하여 선택자를 만드는 경우 IE6는 첫 번째 선택자의 조합(#bold.red)만을 유효하게 처리하고 나머지 선택자 조합을 무시하는 버그 입니다. CSS #bold.red { font-weight:bold; color:red; } #bold.green { font-weight:bold; color:green; } /* IE6는 이 스타일을 처리하지 않음 */ #bold.blue { font-weight:bold; color:blue; } /* IE6는 이 스타일을 처리하지 않음 */ HTML #bold.red #bold.green #bold.blue Expec..

IE6에서 발생하는 ‘더블 마진 플롯 버그‘ 입니다. float된 요소에 float된 방향과 동일한 방향의 margin을 설정하는 경우 margin값이 두 배로 작용하는 버그 입니다. 이 버그는 float된 방향과 같은 방향으로 형제 엘리먼트가 존재하는 경우에는 발생하지 않습니다. CSS .a { float:left; height:100px; background:silver; padding:10px;} .b { float:left; margin-left:100px; width:100px; height:100px; background:red; } /* IE6는 왼쪽 마진을 200px으로 출력 */ HTML .b Expected Result ‘.b’ 요소의 왼쪽으로 100px의 margin이 발생한다. .b..

UI 개발자가 ‘웹 표준’ 방식으로 전환하게 되면 으레 ‘브라우저 호환성’까지 확보하는 작업을 병행하게 됩니다. 정해진 표준 명세에 따라서 코드를 작성하는 것은 쉬우나 ‘브라우저 호환성’을 확보하는 일은 그 반대로 정말 고된 작업입니다. 저는 여기서 적지않은 오해가 발생한다고 생각합니다. ‘웹 표준은 더 많은 자원을 필요로 한다’ 라고 말하는 거죠. 저는 이것이 ‘브라우저 호환성 유지 작업은 더 많은 자원을 필요로 한다’ 라는 사실의 잘못된 표현이라고 생각합니다. ‘웹 표준’과 ‘브라우저 호환성’은 서로 다른 개념인데 이 두 개념을 아무 구분없이 뭉뚱그려 사용함으로서 웹 표준에 대한 그릇된 인식이 형성되었다고 생각합니다. 웹 사이트를 개발함에 있어 ‘브라우저 호환성’은 목표이고 ‘웹 표준’은 방법론 입니..

체크박스

1. display block Element 를 정렬할때 display: inline; 이나 float를 사용한다고 알고계시는 퍼블리셔들이 몇명이있다. 하지만 display경우에는 말그대로 디스플레이될 상태를 설정하는것이다. 즉 ! inline 레벨로 할것이냐 block레벨로 할것이냐 아니면 숨길것이냐를 설정하는것이다. 예전에 어딘가에서 display: inline; 과 float:left;를 같은 용도로 정렬로 사용하는데 차이점을 묻는 글을 본적이 있다. block을 inline으로 하면 자연스럽게 인라인의 특징인 left정렬이 되는것이 당연하다. 예를 들어 span도 inline요소이다 이녀석을 aaaaaa 당연히 left정렬이 된다. 하지만 block요소들은 float로 설정하지않은이상은 떨어져서 ..

개체가 표현되는가를 반환하거나 설정한다. Script object.style.display=[sVal] HTML CSS cssSelector {display:sVal;} 인수 cssSelector : (스타일 선택자) display 속성을 가질수 있는 엘레멘트( ELEMENT)나 클라스(class) 이름 혹은 인식자(id)이다. sVal : (속성 문자열) display 스타일 속성은 개체가 표현되는가를 나타내는 문자열이다. block 개체가 블럭엘레멘트로 표현된다. none 개체가 디스플레이되지 않는다. inline 디폴트이며, 개체가 내용의 크기에따라 인라인 엘레멘트로 표현된다. inline-block 개체가 인라인으로 표현되지만, 개체의 내용은 블럭 엘레멘트로 표현된다. 인접 인라인 엘레멘트는 간격..

http://www.mezzoblue.com/zengarden/alldesigns/

http://jigsaw.w3.org/css-validator/