특정 테이블만 컬럼 너비 조절

기여·2024년 7월 22일
0

소소한 개발팁

목록 보기
58/103

특정 테이블:

html:

<table class="boardListTable">

	<colgroup>
      <col class="seq">
      <col class="title">
      <col class="writer">
      <col class="regdate">
      <col class="del">
    </colgroup>

	<tr class="tr_color">
		<th>seq</th> 
	    <th>title</th>  
	    <th>writer</th>
		<th>regdate</th>
		<th>del</th>
	</tr>
    ...
    </table>

css (공통적용 사항 제외)

.boardListTable {
	width: 800px;
	table-layout: fixed; /* 고정된 레이아웃 설정 */
}
		.boardListTable .seq {
            width: 10%;
        }

        .boardListTable .title {
            width: 50%;
        }

        .boardListTable .writer {
            width: 10%;
        }

      .boardListTable .regdate {
            width: 25%;
        }

       .boardListTable .del {
            width: 5%;
        }

참고로 미적용 테이블:

profile
기기 좋아하는 여자

0개의 댓글