Remove all padding and margin table HTML and CSS
CssHtml TableMarginPaddingCss Problem Overview
I have this table :
<body>
<table id="page" >
<tr id="header" >
<td colspan="2" id="tdheader" >je suis</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
</tr>
</table>
</body>
and here is the css
html, body, #page {
height:100%;
width:100%;
margin:0;
padding:0;
}
#header {
margin:0;
padding:0;
height:20px;
background-color:green;
}
and I want to remove all margin and padding but always I have that :
How can I resolve this?
Css Solutions
Solution 1 - Css
Try to use this CSS:
/* Apply this to your `table` element. */
#page {
border-collapse: collapse;
}
/* And this to your table's `td` elements. */
#page td {
padding: 0;
margin: 0;
}
Solution 2 - Css
Try this:
table {
border-spacing: 0;
border-collapse: collapse;
}
Solution 3 - Css
Use a display block
style= "display: block";
Solution 4 - Css
Tables are odd elements. Unlike div
s they have special rules. Add cellspacing
and cellpadding
attributes, set to 0
, and it should fix the problem.
<table id="page" width="100%" border="0" cellspacing="0" cellpadding="0">
Solution 5 - Css
Try using tag body to remove all margin and padding like that you want.
<body style="margin: 0;padding: 0">
<table border="1" width="100%" cellpadding="0" cellspacing="0" bgcolor=green>
<tr>
<td > </td>
<td> </td>
</tr>
<tr>
<td > </td>
<td> </td>
</tr>
<tr>
<td > </td>
<td> </td>
</tr>
</table>
</body>
Solution 6 - Css
Remove padding between cells inside the table. Just use cellpadding=0
and cellspacing=0
attributes in table tag.
Solution 7 - Css
I find the most perfectly working answer is this
.noBorder {
border: 0px;
padding:0;
margin:0;
border-collapse: collapse;
}