...

View Full Version : Table bordering



Shhhsh
01-30-2012, 12:36 AM
Everything I've learned so far in CSSing is fairly logical, but i can't understand this:


<style type="text/css">
#list {
margin-left: 139px;
margin-top: 20px;
}
TD.mainhead {
height: 20px;
width: 64px;
text-align: center;
border-color: #000;
border-style: double;
border-width: 0px 0px 1px 0px;
padding: 0px;
}
TD.secondhead {
height: 20px;
width: 128px;
text-align: center;
border-color: #000;
border-style: double;
border-width: 0px 0px 1px 0px;
padding: 0px;
}
</style>
<body>
<table id="list">
<thead>
<tr>
<td class="mainhead">Hello</td>
<td class="secondhead">Shhhsh</td>
</tr>
</thead>
</table>

This produces two table cells with a black border below them and no other borders, padding or margin. How come the border lines beneath don't link together when there is meant to be 0 pixels of space between them?

I know that i can work around this, so I'm not asking anyone to give me a solution. I just want to know the logic that causes this (or lack of logic)? Does it mean those cells are 65px and 129px wide?

abduraooft
01-30-2012, 07:05 AM
Add border-collapse:collapse; to #list

Shhhsh
01-30-2012, 07:12 AM
Add border-collapse:collapse; to #list

Absolutely perfect. Simple and logical. I had already tried using border-collapse, but put it in the wrong place. Thank you so much for your help. :)

nameno
01-30-2012, 07:31 AM
or you can ad cellspacing to html

<table id="list" cellspacing="0">



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum