VSO
VSO

Reputation: 12646

Remove All Padding/Borders/Margin

First of all, I know we have a thousand questions on this, but I do believe I went through just about everything relevant and tried it. In short, I have a simple html page with a body, which contains a table, which contains 2 rows, each row has two cells. I remove all padding, margin, and borders with the exception where I account for border diameter in setting width/height. Goal is to print a 4x3" label for something, which is what the body size is set to in mm.

tl;dr: Why do I still have padding?

* {
    margin: 0;
    padding: 0;
}

.noMarginBordersPadding{
    padding: 0px;
    border: 0px;
    margin: 0px;
}

http://codepen.io/anon/pen/EPEKba

enter image description here

P.S. If you hit print, there is also mysterious whitespace on the bottom, below the border, but I don't want to dilute the question too much.

Upvotes: 1

Views: 3917

Answers (1)

j08691
j08691

Reputation: 207900

You also need to set the border-collapse property for the table. The default value is separate:

table {
  border-collapse: collapse;
}

Upvotes: 3

Related Questions