38 users online (0 members and 38 guests)  


  Results 1 to 7 of 7

Related

  1. Keep It Simple S****d    Forum: HTML Forum
    Replies: 3
  2. My simple art site...    Forum: Show it off!
    Replies: 7
  3. Replies: 5
  4. Simple Table Border    Forum: CSS Forum
    Replies: 3
  1. #1
    Mr. Blue's Avatar
    Evil twin of Dave

    Status
    Offline
    Join Date
    Jul 2001
    Location
    MA, USA
    Posts
    148

    Simple Site...Need Table Help...

    Ok I'm working on a simple site for my dentist, he owns a Self-Storage company and he drew up a website layout and gave me the logo they are using for their signs so basically I just need to get the layout done and put the content in. I wanted to make my own logo and design but they were really stuck on this so I went with it...anyways...on to my question.

    The temp. link: http://users.adelphia.net/~dabailey/cranberry/

    If you go to the Photo Tour section you'll see that the spacing between the spaces on the left gets all messed up and that's what I'm wondering about...here is a nice little picture as to what I need:

    http://users.adelphia.net/~dabailey/cranberry/problem.gif

    The black boxes are individual cells in the table and in the big table is my content for each page, I need that to change and enlarge vertically as I add mroe content without messing up the links on the left. Thx...hope I explained myself well enough here!

    -Dave

  2. #2
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    Your nested table is a mess
    The basic structure should be as follows
    Code:
    <table>
    <tr>
    <td valign="top">
    insert nav table
    </td>
    <td valign="top">
    insert image table
    </td>
    </tr>
    </table>
    currently your code
    Code:
      <table width="710" border="0" cellpadding="5" cellspacing="0" bgcolor="#CCCCCC">
    		<tr>	
                <td valign="top">
    		<table width="100%" border="0">
    		<tr>
    			<td height="60" width="18%" align="left"><a href=index.html>Home</a></td><td rowspan="7" class="font1" align="center" width="82%"><br><img src="images/indexholder.gif" width="500" height="300"><br><br>Any Questions or Comments?<br>Feel Free To Call Us: <b>(508) 291-1318</b><br>or<br>Send Us An Email: <a href="mailto:Cranberry.SelfStorage@verizon.net">Cranberry.SelfStorage@verizon.net</a></td>
    		</tr>
    		<tr>
    			<td height="60" width="18%" align="left"><a href=visit.html>Visit Us</a></td>
    		</tr>
    		<tr>
    			<td height="60" width="18%" align="left"><a href=guide.html>Storage Guide</a></td>
    		</tr>
    		<tr>
    			<td height="60" width="18%" align="left"><a href=tour.html>Photo Tour</a></td>
    		</tr>
    		<tr>
    			<td height="60" width="18%" align="left"><a href=prices.html>Prices</a></td>
    		</tr>
    		<tr>
            	<td height="60" width="18%" align="left"><a href=specials.html>Specials!</a></td>
    		</tr>
    		<tr>
    		<td width="18%"></td>
    		</table>
    	  </td>
        </tr>
      </table>
    You have 2 cells in 1 row while the others have 1, if you were to use this code you would need a colspan="2" in each row that has a single cell, however this is bad code to begin with so it does not matter.

    take that image out of ths table, whats left and put it in the proper spot of the table above, put the image in its own table and insert it in to its proper spot in the parent table above.

    Dave

  3. #3
    Mr. Blue's Avatar
    Evil twin of Dave

    Status
    Offline
    Join Date
    Jul 2001
    Location
    MA, USA
    Posts
    148
    Sorry Dave, either I'm really tired or I'm not understanding exactly what I should be doing here. I was trying to use the 'rowspan' command but evidently that's not what I should be using. Are you saying I should:

    Code:
    <table width="710" border="0" cellpadding="5" cellspacing="0" bgcolor="#CCCCCC">
    <tr>
    <td valign="top">
    <table width="100" border="0">
    <tr>
    <td height="60" align="left"><a href=index.html>Home</a></td>		
    </tr>
    <tr>
    <td height="60" align="left"><a href=visit.html>Visit Us</a></td>
    </tr>
    <tr>
    <td height="60" align="left"><a href=guide.html>Storage Guide</a></td>
    </tr>
    <tr>
    <td height="60" align="left"><a href=tour.html>Photo Tour</a></td>
    </tr>
    <tr>
    <td height="60" align="left"><a href=prices.html>Prices</a></td>
    </tr>
    <tr>
    <td height="60" align="left"><a href=specials.html>Specials!</a></td>
    </tr>
    </table>
    </td>
    <td valign="top">
    <table width="610" border="0" cellpadding="5" cellspacing="0" bgcolor="#CCCCCC">
    <tr>
    <td align="center"><br><img src="images/indexholder.gif" width="500" height="300"><br></td>
    </tr>
    <tr>
    <td class="font1">
    <br>Any Questions or Comments?<br>Feel Free To Call Us: <b>(508) 291-1318</b><br>or<br>Send Us An Email: <a href="mailto:Cranberry.SelfStorage@verizon.net">Cranberry.SelfStorage@verizon.net</a></td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    Or something of the sort...sorry I'm tired...can you help me out here? Wait do i need 'colspan=2' in the 'td' tags which contain 'valign=top' in those same ones?
    Last edited by Mr. Blue; 03-08-2003 at 01:53 AM.

  4. #4
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    my fault, I did not see the rowspan attribute in the tag.(too much pain medicine)

    The best solution is still as stated,

    Create a table with 1 row and 2 cells, put the valign=top in each of these cells (no colspan or rowspan needed).

    Next, in each of the above cells insert an all new table, the first containing the nav, the second containing the image.

    Dave
    AHFBWEB Less customers per server, more power for you!

    Business Class Shared Hosting

  5. #5
    Mr. Blue's Avatar
    Evil twin of Dave

    Status
    Offline
    Join Date
    Jul 2001
    Location
    MA, USA
    Posts
    148
    omg...lol...now that I'm awake I don't see why I didn't do that in the first place. Thx!

  6. #6
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    Having worked on exactly these kinds of layouts (http://kevin.ciriacks.com) for the past several months, here's a tip:

    leave the WIDTH and HEIGHT attributes off the <IMG ..> tag but do place the WIDTH= and HEIGHT= of the largest image(s) in the <TD VALIGN=top ...> tag.

    Also use the NAME=(name) attribute of the <TABLE ...> as a reference when calling the images via the <A HREF=#(name ) onClick="document.poPhoto.src='image1.jpg'">image1</A> or other process.

    My objective was to display the pictures without having the display window jumping around the screen when image sizes varied.

  7. #7
    Mr. Blue's Avatar
    Evil twin of Dave

    Status
    Offline
    Join Date
    Jul 2001
    Location
    MA, USA
    Posts
    148
    Thx again for yet another helpful tip..as always



Tags for this Thread