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 138 · Accepted Answer · edited Oct 17 '19 at 01:19

138

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

864
13
28

answered May 07 '13 at 20:27

wroniasty

7,102
2
28
24

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

20

Try this:

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

answered Sep 18 '14 at 14:24

zoom23

614
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 5 · Answer 3 · edited Dec 08 '14 at 15:04

5

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

5,605
5
40
80

answered Dec 08 '14 at 14:40

memer

67
1
2

3

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 4 · 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 5 · Answer 5 · edited Aug 17 '18 at 10:52

5

Use a display block

style= "display: block";

edited Aug 17 '18 at 10:52

glennsl

23,127
11
49
65

answered Aug 17 '18 at 10:31

yoko

51
1
1

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

13,934
8
78
93

answered May 07 '13 at 20:28

Nps

1,568
4
18
37

8

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