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

168

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,432
3
18
36

answered May 07 '13 at 20:27

wroniasty

7,884
2
32
24

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

24

Try this:

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

answered Sep 18 '14 at 14:24

zoom23

694
2
10
23

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

8

Use a display block

style= "display: block";

edited Aug 17 '18 at 10:52

glennsl

28,186
12
57
75

answered Aug 17 '18 at 10:31

yoko

81
1
1

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

7

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

Kelderic

6,502
8
46
85

answered Dec 08 '14 at 14:40

memer

95
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

18,680
13
103
118

answered May 07 '13 at 20:28

Nps

1,638
4
20
40

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

score 0 · Answer 8 · answered Jul 09 '22 at 09:13

0

I had exactly the same problem. That is a table with collapsed borders and <IMG images in each <TD cell. I had padding and margin set to zero on everything. Nothing would get rid of the bottom padding of the <IMG

Changing the CSS attribute of the <IMG tag to "display: block;" solved it. Thank-you - user yoko

answered Jul 09 '22 at 09:13

Raspberry Pieman

21
2

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jul 09 '22 at 21:13

Ambika Sharma · Answer 9 · 2022-07-09T09:18:01.523

0

Remove Padding from Left and right side :

padding:0; margin:0;

for Table cell padding remove :

cellpadding : 0; cellspacing : 0;

edited Jul 09 '22 at 09:18

answered Jul 09 '22 at 09:17

Ambika Sharma

1
2

1

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). – Community Jul 09 '22 at 21:20

Remove all padding and margin table HTML and CSS

9 Answers9

Linked

Related