Getting table cells next to each other

[Mark Carroll]

I can't get my table cells to not have a gap between them in IE.
For example, with IE6SP1 I get a gap between the two red squares
on http://www.chiark.greenend.org.uk/~markc/test/test.html instead
of just seeing one red rectangle. The CSS in that case had
width: 1px; margin: 0; padding: 0; border-width: 0; border-spacing: 0

What can I do to get the red squares nestled together in the table
with no space in between?

-- Mark

[Harlan Messinger]

"Mark Carroll" <ma***@chiark.greenend.org.uk> wrote in message
news:Pp*******@news.chiark.greenend.org.uk...

I can't get my table cells to not have a gap between them in IE.
For example, with IE6SP1 I get a gap between the two red squares
on http://www.chiark.greenend.org.uk/~markc/test/test.html instead
of just seeing one red rectangle. The CSS in that case had
width: 1px; margin: 0; padding: 0; border-width: 0; border-spacing: 0

What can I do to get the red squares nestled together in the table
with no space in between?

The table needs border-collapse: collapse;

But you've got problems anyway. You're giving the tables AND the rows AND
the cells the class "tiny", and for that class you're specifying a width of
1px. So your table, your rows, and your cells are all going to have width
1px--which makes no sense.

Just assign the class to the table. Then use separate selectors for the
table itself, the rows, and the cells to indicate which properties go with
each.

table.tiny { /*table properties*/}
table.tiny tr { /*row properties*/ }
table.tiny td { /*cell properties*/ }