[CSS] Table 셀 테두리 사이 간격 없애기 / border-collapse : collapse;

1. 개요

 Table 생성 후 셀마다 셀 테두리를 설정하였으나, 셀 테두리 사이 간격이 생기는 현상이 발생하고 있음.

셀 테두리가 벌어짐

---

2. 해결

 table 태그에 대한 css로 border-collapse : collapse 설정을 적용하면 표의 테두리 및 셀간 테두리 간격을 없애고, 겹치는 부분은 한줄로 표시.

table{
    border : 1px solid black;
    border-collapse : collapse;
}
 
td,th{
    border : 1px solid black;
    width : 100px;
    height : 30px;
}

---

3. 결과

border-collapse : collapse 적용