CODEWITHSUNDEEP
htmlcssfirefox
dlasalle
dlasalle

Reputation: 1725

css make tbody same size as table

I can't get the tbody element to fully fill the table element:

<table>
  <tbody>
    <tr>
      ...
    </tr>
  </tbody>
</table>

The CSS is:

table {
  width: 100%;
  margin: 0 0;
  padding: 0 0;
}

tbody {
  margin: 0 0;
  padding: 0 0;
}

Resulting table dimensions (in firefox 56):

rendered table dimensions

Resulting tbody dimensions (in firefox 56):

enter image description here

This leaves a 2 pixel white border surrounding the contents of the table, that I want to get rid of. Is there some other CSS property that I need to zero out?

Upvotes: 2

Views: 1003

Answers (1)

Joseph Marikle
Joseph Marikle

Reputation: 78520

This is because of built in borders and border spacing.
To correct the issue add the border-collapse: collapse; style to the table.

Upvotes: 3

Related Questions