Remove all padding and margin table HTML and CSS

Question

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 :

enter image description here

How can I resolve this?

score 153 · Accepted Answer · edited Oct 17 '19 at 01:19

153

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;
}

edited Oct 17 '19 at 01:19

Ícaro

1,082
1
18
34

answered May 07 '13 at 20:27

wroniasty

7,474
2
30
24

You're amazing, thanks. – HoldOffHunger Oct 25 '21 at 00:42

score 21 · Answer 2 · answered Sep 18 '14 at 14:24

21

Try this:

table { 
border-spacing: 0;
border-collapse: collapse;
}

answered Sep 18 '14 at 14:24

zoom23

634
2
10
22

3

border-spacing doesn't work when border-collapse in collapse mode. – Ivan Z Nov 17 '14 at 19:13
@IvanZ It was years ago, so I don't remember exactly, but there were some broken browsers which needed that. – wroniasty May 15 '19 at 16:04

score 7 · Answer 3 · edited Aug 17 '18 at 10:52

7

Use a display block

style= "display: block";

edited Aug 17 '18 at 10:52

glennsl

25,730
12
57
71

answered Aug 17 '18 at 10:31

yoko

71
1
1

score 6 · Answer 4 · edited Dec 08 '14 at 15:04

6

Tables are odd elements. Unlike divs 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">

edited Dec 08 '14 at 15:04

Andy Mercer

6,124
7
44
82

answered Dec 08 '14 at 14:40

memer

85
1
2

4

The accepted answer uses css padding and margin, which is the recommended alternative to cellspacing and cellpadding, which have been deprecated for many years now. And note that HTML5 does not support cellspacing and cellpadding. – ToolmakerSteve Apr 28 '16 at 05:00

Vanda Ros · Answer 5 · 2020-05-30T21:00:42.157

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 >&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td >&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td >&nbsp;</td>
            <td>&nbsp;</td>
        </tr>
    </table>
</body>

score 3 · Answer 6 · edited Jan 26 '17 at 17:08

3

Remove padding between cells inside the table. Just use cellpadding=0 and cellspacing=0 attributes in table tag.

edited Jan 26 '17 at 17:08

Andrew

16,273
10
93
104

answered May 07 '13 at 20:28

Nps

1,618
4
19
38

9

It should be better to use CSS instead of deprecated attributes. – Matteo Tassinari May 16 '14 at 13:56

score 3 · Answer 7 · answered Jun 01 '16 at 10:56

3

I find the most perfectly working answer is this

.noBorder {
    border: 0px;
    padding:0; 
    margin:0;
    border-collapse: collapse;
}

answered Jun 01 '16 at 10:56

Kai Hayati

59
1
2

Remove all padding and margin table HTML and CSS

7 Answers7

Linked

Related