caption과 colgroup에 대한 고찰 산유물(마스터K님 제보)
{overflow:hidden;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0}
적용시 position:absolute; 인한 크롬, 사파리에서 width값 미적용 문제
<colgroup>을 사용안하고 <td>에 스타일 적용시 사용가능
{overflow:hidden;margin-left:-9999px;width:1px;height:1px;font-size:0;line-height:0}
최신버전 크롬, 사파리 및 lte ie8, 파폭에서도 width값 적용 및 caption 숨김
<colgroup>에 width값 적용시 사파리 미적용 현상 발생
예제소스) http://sirgle.com/caption_sr_test.php 활용
<![endif]-->
ie 6,7 테스터로 돌려본결과에서는 노이즈(?) 미출력
<table id="col">
적용시 position:absolute; 인한 크롬, 사파리에서 width값 미적용 문제
<colgroup>을 사용안하고 <td>에 스타일 적용시 사용가능
{overflow:hidden;margin-left:-9999px;width:1px;height:1px;font-size:0;line-height:0}
최신버전 크롬, 사파리 및 lte ie8, 파폭에서도 width값 적용 및 caption 숨김
<colgroup>에 width값 적용시 사파리 미적용 현상 발생
예제소스) http://sirgle.com/caption_sr_test.php 활용
html5
#col {margin-bottom:50px;border-collapse:collapse;border-spacing:0}
#col {margin-bottom:50px;border-collapse:collapse;border-spacing:0}
#col caption{overflow:hidden;margin-left:-9999px;width:1px;height:1px;font-size:0;line-height:0}
<!--[if lte IE 7]>
#col caption{overflow:hidden;margin-left:-9999px;width:1px;height:0px;font-size:0;line-height:0}<!--[if lte IE 7]>
<![endif]-->
ie 6,7 테스터로 돌려본결과에서는 노이즈(?) 미출력
<table id="col">
<caption>테스트용 테이블</caption>
<colgroup>
<col width="50px">
<col width="100px">
<col width="150px">
</colgroup>
<thead>
<tr>
<th>1st header</th>
<th>2nd header</th>
<th>3rd header</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
</tbody>
</table>
댓글 1개
12년 전
이 분도 개발자시군요 .....
글이 이해가 안됨............
개발자의 특징 (자기 머릿속에 있는걸 풀어쓰지 못함 -_-)
글이 이해가 안됨............
개발자의 특징 (자기 머릿속에 있는걸 풀어쓰지 못함 -_-)
게시판 목록
자유게시판
| 번호 | 제목 | 글쓴이 | 날짜 | 조회 |
|---|---|---|---|---|
| 공지 |
 thisgun |
2주 전 | 58 | |
| 199718 |
thisgun |
2주 전 | 38 | |
| 199717 | 1개월 전 | 32 | ||
| 199716 |
느긋한카키쿠키
|
1개월 전 | 20 | |
| 199715 |
현대적인무질서한까마귀
|
1개월 전 | 25 | |
| 199714 | 1개월 전 | 36 | ||
| 199713 | 1개월 전 | 41 | ||
| 199712 | 1개월 전 | 305 | ||
| 199711 |
안졸리니졸리니
|
1개월 전 | 152 | |
| 199710 |
 glitter0gim |
1개월 전 | 166 | |
| 199709 |
glitter0gim |
1개월 전 | 98 | |
| 199708 | 1개월 전 | 110 | ||
| 199707 | 2개월 전 | 248 | ||
| 199706 | 2개월 전 | 47 | ||
| 199705 | 2개월 전 | 33 | ||
| 199704 | 2개월 전 | 57 | ||
| 199703 | 2개월 전 | 61 | ||
| 199702 | 2개월 전 | 106 | ||
| 199701 | 2개월 전 | 116 | ||
| 199700 | 2개월 전 | 88 | ||
| 199699 | 2개월 전 | 92 | ||
| 199698 | 2개월 전 | 140 | ||
| 199697 | 2개월 전 | 104 | ||
| 199696 |
 Gothrock |
2개월 전 | 253 | |
| 199695 | 2개월 전 | 97 | ||
| 199694 | 2개월 전 | 128 | ||
| 199693 | 2개월 전 | 196 | ||
| 199692 | 2개월 전 | 208 | ||
| 199691 |
 샬롬이아빠 |
2개월 전 | 182 | |
| 199690 | 2개월 전 | 266 | ||
| 199689 | 2개월 전 | 167 |
댓글 작성
댓글을 작성하시려면 로그인이 필요합니다.
로그인하기