Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New to the CF scene
    Join Date
    Jul 2003
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Table with one cell repeating


    This is the code for my table webpage.

    <HTML>
    <HEAD>
    <TITLE> </TITLE>
    </HEAD>
    <BODY style="margin: 0px 0px 0px 0px;">

    <!-- Begin Table -->
    <TABLE BORDER="0" CELLPADDING="0" CELLSPACING="0" WIDTH="776" HEIGHT="413">

    <TR>
    <TD ROWSPAN="1" COLSPAN="3" WIDTH="629" HEIGHT="87">
    <IMG NAME="table0" SRC="table_1x1.jpg" WIDTH="629" HEIGHT="87" BORDER="0"></TD>
    <TD ROWSPAN="1" COLSPAN="2" WIDTH="147" HEIGHT="87">
    <IMG NAME="table1" SRC="table_1x2.jpg" WIDTH="147" HEIGHT="87" BORDER="0"></TD>
    <TD WIDTH="1" HEIGHT="87">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="87" BORDER="0"></TD>
    </TR>

    <TR>
    <TD ROWSPAN="1" COLSPAN="1" WIDTH="151" HEIGHT="25">
    <IMG NAME="table2" SRC="table_2x1.jpg" WIDTH="151" HEIGHT="25" BORDER="0"></TD>
    <TD ROWSPAN="5" COLSPAN="1" WIDTH="466">
    Data
    </TD>
    <TD ROWSPAN="2" COLSPAN="2" WIDTH="145" HEIGHT="31">
    <IMG NAME="table3" SRC="table_2x3.jpg" WIDTH="145" HEIGHT="31" BORDER="0"></TD>
    <TD ROWSPAN="5" COLSPAN="1" WIDTH="14" HEIGHT="283"></TD>
    <TD WIDTH="1" HEIGHT="25">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="25" BORDER="0"></TD>
    </TR>

    <TR>
    <TD ROWSPAN="2" COLSPAN="1" WIDTH="151" HEIGHT="158" background="table_3x1.jpg">
    Side Top</TD>
    <TD WIDTH="1" HEIGHT="6">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="6" BORDER="0"></TD>
    </TR>

    <TR>
    <TD ROWSPAN="2" COLSPAN="2" WIDTH="145" HEIGHT="155" background="table_4x1.jpg">
    Right Top</TD>
    <TD WIDTH="1" HEIGHT="152">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="152" BORDER="0"></TD>
    </TR>

    <TR>
    <TD ROWSPAN="2" COLSPAN="1" WIDTH="151" background="table_5x1.jpg">
    Side Bottom</TD>
    <TD WIDTH="1" HEIGHT="3">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="3" BORDER="0"></TD>
    </TR>

    <TR>
    <TD ROWSPAN="1" COLSPAN="2" WIDTH="145" background="table_6x1.jpg">
    Right Bottom</TD>
    <TD WIDTH="1" HEIGHT="97">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="97" BORDER="0"></TD>
    </TR>

    <TR>
    <TD ROWSPAN="1" COLSPAN="5" WIDTH="776" HEIGHT="43">
    <IMG NAME="table8" SRC="table_7x1.jpg" WIDTH="776" HEIGHT="43" BORDER="0"></TD>
    <TD WIDTH="1" HEIGHT="43">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="1" HEIGHT="43" BORDER="0"></TD>
    </TR>

    <TR>
    <TD WIDTH="151" HEIGHT="1">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="151" HEIGHT="1" BORDER="0"></TD>
    <TD WIDTH="466" HEIGHT="1">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="466" HEIGHT="1" BORDER="0"></TD>
    <TD WIDTH="12" HEIGHT="1">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="12" HEIGHT="1" BORDER="0"></TD>
    <TD WIDTH="133" HEIGHT="1">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="133" HEIGHT="1" BORDER="0"></TD>
    <TD WIDTH="14" HEIGHT="1">
    <IMG NAME="blank" SRC="blank.gif" WIDTH="14" HEIGHT="1" BORDER="0"></TD>
    </TR>
    </TABLE>
    <!-- End Table -->

    </BODY>
    </HTML>

    How do I make it so that when more information is entered into the data cell (the one with the text "Data" in it), only the "Side Bottom" and "Right Bottom" get longer and everything else stays the same?

    Thanks!

    Mlliw

  • #2
    Regular Coder Skyzyx's Avatar
    Join Date
    Aug 2002
    Location
    Silicon Valley, CA
    Posts
    980
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Give "Side Top" and "Right Top" and explicit height, then give the lower two a width of "auto".

    Code:
    <html>
    <head>
    <title> </title>
    </head>
    <body style="margin: 0px 0px 0px 0px;">
    
    <!-- begin table -->
    <table border="1" cellpadding="0" cellspacing="0" width="776" height="413">
    	<tr>
    		<td rowspan="1" colspan="3" width="629" height="87">
    			<img name="table0" src="table_1x1.jpg" width="629" height="87" border="0">
    		</td>
    		<td rowspan="1" colspan="2" width="147" height="87">
    			<img name="table1" src="table_1x2.jpg" width="147" height="87" border="0">
    		</td>
    		<td width="1" height="87">
    			<img name="blank" src="blank.gif" width="1" height="87" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td rowspan="1" colspan="1" width="151" height="25">
    			<img name="table2" src="table_2x1.jpg" width="151" height="25" border="0">
    		</td>
    		<td rowspan="5" colspan="1" width="466" style="height:auto;">
    			Data
    		</td>
    		<td rowspan="2" colspan="2" width="145" height="31">
    			<img name="table3" src="table_2x3.jpg" width="145" height="31" border="0">
    		</td>
    		<td rowspan="5" colspan="1" width="14" height="283">
    		</td>
    		<td width="1" height="25">
    			<img name="blank" src="blank.gif" width="1" height="25" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td rowspan="2" colspan="1" width="151" height="158" background="table_3x1.jpg" style="height:80px;">
    			Side Top
    		</td>
    		<td width="1" height="6">
    			<img name="blank" src="blank.gif" width="1" height="6" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td rowspan="2" colspan="2" width="145" height="155" background="table_4x1.jpg" style="height:80px;">
    			Right Top
    		</td>
    		<td width="1" height="152">
    			<img name="blank" src="blank.gif" width="1" height="152" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td rowspan="2" colspan="1" width="151" background="table_5x1.jpg" style="height:auto;">
    			Side Bottom
    		</td>
    		<td width="1" height="3">
    			<img name="blank" src="blank.gif" width="1" height="3" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td rowspan="1" colspan="2" width="145" background="table_6x1.jpg" style="height:auto;">
    			Right Bottom
    		</td>
    		<td width="1" height="97">
    			<img name="blank" src="blank.gif" width="1" height="97" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td rowspan="1" colspan="5" width="776" height="43">
    			<img name="table8" src="table_7x1.jpg" width="776" height="43" border="0">
    		</td>
    		<td width="1" height="43">
    			<img name="blank" src="blank.gif" width="1" height="43" border="0">
    		</td>
    	</tr>
    	<tr>
    		<td width="151" height="1">
    			<img name="blank" src="blank.gif" width="151" height="1" border="0">
    		</td>
    		<td width="466" height="1">
    			<img name="blank" src="blank.gif" width="466" height="1" border="0">
    		</td>
    		<td width="12" height="1">
    			<img name="blank" src="blank.gif" width="12" height="1" border="0">
    		</td>
    		<td width="133" height="1">
    			<img name="blank" src="blank.gif" width="133" height="1" border="0">
    		</td>
    		<td width="14" height="1">
    			<img name="blank" src="blank.gif" width="14" height="1" border="0">
    		</td>
    	</tr>
    </table>
    <!-- end table -->
    
    </body>
    </html>
    Something like that should work. Oh, and if you ever want to get any further in web design, you should really keep your tags and attributes lowercase. It's a good start with the quotes though. Keep that up.

    You'll also want to learn to get away from tables and spacer gifs, and use valid, semantic XHTML for structure, and CSS for layout purposes.

    Until you get there, however, I hope this helps!

    Creator of SimplePie and Tarzan AWS, co-founder of WarpShare, co-built the Y! Messenger website, usability-focused, and an INFJ personality.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •