CODEWITHSUNDEEP
cssinternet-explorer-8internet-explorer-7
Richard Knop
Richard Knop

Reputation: 83695

Spaces Between Table Rows In IE7/8

I would like there to be spaces between rows of my table in IE7/8. I did this:

.selector tr {
    display: block;
    padding-bottom: 3px;
}

Which works in Firefox but not in IE7/8 where the 3px gap doesn't appear.

Upvotes: 2

Views: 330

Answers (2)

Pekka
Pekka

Reputation: 449485

Even if this may work in some browsers, changing the display of a table row feels like an awful hack. Don't do it.

The only valid, cross-browser way that I know of is to give each td some padding-bottom, or maybe a transparent border:

.selector tr td { padding-bottom: 3px }

Upvotes: 3

artlung
artlung

Reputation: 34013

Why not do:

.selector tr td {
    display: block;
    padding-bottom: 3px;
}

If you're also using <th> tags then do:

.selector tr td, .selector tr th {
    display: block;
    padding-bottom: 3px;
}

You should not need that display: block; rule, but perhaps it's overriding something else you have in your stylesheets.

Upvotes: 1

Related Questions