safari 및 google Chrome에서의 Fieldset CSS버그
Publisher/CSS / 2008. 9. 8. 21:54
요즘 구글크롬으로 이제껏 작업했던 사이트의 버그 잡는 쏠쏠한(ㅠ.,ㅠ)재미에 푹 빠졌다.
google chrome의 경우 webkit엔진을 사용하므로 safari 와 비슷하게 작동해서 불행히도 css버그도 같이 공유하고 잇따.
Safari , google chrome, FF2 의 경우 Fieldset 버그가 존재한다.
이럴경우에는 다음과 같이 처리하면 된다.
fieldset:after {content: “.”; display: block; height: 0; clear: both; }
위의 내용중 :after는 CSS2 Spec에 나온것이므로 기술하지 않은 곳에서는 다음과 같이 작업한다.
fieldset {display: block; height: 0; clear: both; }
<=== height:0, clear:both 가 중요하다.. ㅡ.,ㅡ;
사족을 붙이자면 실제 작업을 하다가 보면 DTD버전이 4.01 이냐 xhtml1.0 이냐에 따라 이놈의 fieldset은 유난히 많이 틀리다는것을 알수 있다.
html4.01일 경우에는 <fieldset>밑에 첫번째 자식노드로 <legend>가 반드시 필요하다
html4.01에서 "반드시" 라는 것이 존재하는것이 이놈 뿐이다... 대부분 W3C 권고안이기 때문에 생략이 가능하나 이놈만은 생략하면 validtion부분에서 빨간색으로 표현된다... ㅡ.,ㅡ;
그러나 xhtml1.0에서는 생략이 가능하다....
'Publisher > CSS' 카테고리의 다른 글
CSS로 Table 디자인 하기 (15) | 2009.04.28 |
---|---|
CSS Hack in IE8 (9) | 2009.04.27 |
PNG(setPNG)를 이용시 이미지 토글 이벤트 먹는 경우 (2) | 2008.08.13 |
CSS Hack(핵) 정리 및 IE6,7,FF3 CSS맞추기 (0) | 2008.08.02 |
웹폰트로 이쁜 웹페이지를 꾸며보자 (4) | 2008.07.23 |