반응형
CSS를 사용하여 셀 사이에 공백 추가 (td)
셀의 배경색이 흰색이고 테이블의 배경색이 파란색이므로 셀 사이에 공백이있는 테이블을 추가하려고하는데, 패딩과 여백이 작동하지 않는 것을 쉽게 알 수 있습니다 td
. 셀 내부에만 공간을 추가합니다.
원하는 border-spacing
:
<table style="border-spacing: 10px;">
또는 어딘가에 CSS 블록에서 :
table {
border-spacing: 10px;
}
에서 quirksmode 를 참조하십시오 border-spacing
. 그주의 border-spacing
아래 IE7과 작동하지 않습니다.
table {
border-spacing: 10px;
}
내가 제거한 후에 이것은 나를 위해 일했습니다.
border-collapse: separate;
내 테이블 태그에서.
내 것은 :
border-spacing: 10px;
border-collapse: separate;
태그 또는 css 속성에 cellspacing
및 cellpadding
속성을 사용하는 것이 좋습니다.table
border-spacing
TABLE 태그의 cellspacing (셀 간 거리) 매개 변수는 정확히 원하는 것입니다. 단점은 x와 y에 모두 사용되는 하나의 값이라는 것입니다. 수직 / 수평으로 다른 간격이나 패딩을 선택할 수 없습니다. CSS 속성도 있지만 널리 지원되지는 않습니다.
cellspcing
/ cellpadding
/ border-spacing
속성이 작동하지 않았다고 가정 하면 다음과 같이 코드를 사용할 수 있습니다.
<div class="form-group">
<table width="100%" cellspacing="2px" style="border-spacing: 10px;">
<tr>
<td width="47%">
<input type="submit" class="form-control btn btn-info" id="submit" name="Submit" />
</td>
<td width="5%"></td>
<td width="47%">
<input type="reset" class="form-control btn btn-info" id="reset" name="Reset" />
</td>
</tr>
</table>
</div>
테이블 너비를 사용하여 버튼을 분리하고 빈 td를 2 또는 1 %로 만드는 동안 시도하고 성공했습니다.
참고 URL : https://stackoverflow.com/questions/2070817/add-space-between-cells-td-using-css
반응형
'program story' 카테고리의 다른 글
moment.js에서 날짜 만 비교하는 방법 (0) | 2020.09.21 |
---|---|
jQuery 드래그 앤 드롭으로 클릭 이벤트 방지 (0) | 2020.09.21 |
jQuery 플러그인 : 콜백 기능 추가 (0) | 2020.09.21 |
타임 스탬프 형식으로 현재 NSDate 가져 오기 (0) | 2020.09.20 |
배열을 N 길이의 청크로 분할 (0) | 2020.09.20 |