CODEWITHSUNDEEP
csscss-tables
abcde123483
abcde123483

Reputation: 3905

Removing table lines and table space between cells in css

I have this site: http://redditlist.com/dir/1026 and I'm stuck on trying to remove spacing between cells so it will look more like this: http://redditlist.com.

Upvotes: 12

Views: 17331

Answers (4)

Retro CIB
Retro CIB

Reputation: 63

try

table td { display: table-cell; }

Upvotes: 0

user3378188
user3378188

Reputation: 1

Try this

table.className td
{
    display: inline-block;
}

or

table.className td
{
    display: block;
}

Upvotes: 0

user456814
user456814

Reputation:

Use the border-collapse CSS property to remove space between cells:

table {
    border-collapse: collapse;
}

You see spacing between table cells by default because each cell has its own border, the cells don't share borders. This is called "the separated model", as explained in the Mozilla Developer CSS Reference:

The separated model is the traditional HTML table border model. Adjacent cells each have their own distinct borders. The distance between them given by the border-spacing property.

You can "remove" the spacing between the cells by making them share borders with each other, which is known as the "collapsed border model":

In the collapsed border model, adjacent table cells share borders.

Upvotes: 10

Jaspero
Jaspero

Reputation: 2972

table#myTable{
  border-collapse:collapse;
}

Upvotes: 21

Related Questions