Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

table question 4

Status
Not open for further replies.

occas

Technical User
Jan 14, 2004
164
US
<table width="100%">
<tr>
<td width="50%" align="center" colspan="2">Joe</td>
<td width="50%" align="center" colspan="2">John</td>
</tr>
<tr>
<td width="33%" align="center">Harry</td>
<td width="33%" align="center">Jim</td>
<td width="34%" align="center">Pete</td>
</tr>
</table>

shouldn't this table yield Joe and John in the top row, centered in their cells? with Harry Jim and Pete in the bottom row centered in their cells also?

everything is okay but the top row. John is not centered. when i make the border visible, the top cell with Joe extends across both cells beneath it. instead of halfway across the middle cell as i would expect. any help would be great. tyvm.
 

You need to remove one of the cells in the bottom row, or remove the colspan from one of the cells in the top row. Your column maths just don't add up.

Dan
 
Well... I agree that the column maths don't add up... but the solution is to either add an extra column on the bottom row (so you have 4 columns == 2 x colspanned 2 columns)... or remove the colspan on one of the columns in the top row (as BillyRay correctly points out).

Aren't tables fun!

Jeff
 
I've tried it in both IE6 and NS7 and Joe & john are centered in their resprective cells (put a border="1" in the table tag to see), but Dan and Jeff are correct. To get what you want, it should look like this:

Code:
<table width="100%">
  <tr>
    <td colspan="3">
       <table width="100%">
         <td width="50%" align="center">Joe</td>
         <td width="50%" align="center">John</td>
       </table> 
    </td>
  </tr>
  <tr>
    <td width="33%" align="center">Harry</td>
    <td width="33%" align="center">Jim</td>
    <td width="34%" align="center">Pete</td>
  </tr>
</table>

Tables are made up of columns and you can't change cell widths from row to row without nesting tables inside of cells. So, your bottom row is going to take over by creating 3 equal columns (almost) and your top row, regardless of your cell width specs, are going to follow the bottom row of 3 columns.

There's always a better way. The fun is trying to find it!
 
i tried thanking all 3 of you, but for some reason only the first one took.
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top