162 users online (0 members and 162 guests)  

> > > > Table Sizing Problem

  Results 1 to 7 of 7

Related

  1. (iframe in table)problem    Forum: HTML Forum
    Replies: 2
  2. table css problem (ex. inclued)    Forum: CSS Forum
    Replies: 2
  3. Stylesheet/table problem    Forum: CSS Forum
    Replies: 3
  4. Table Problem    Forum: HTML Forum
    Replies: 11
  1. 04-07-2007, 03:20 PM #1
    homeric
    homeric is offline
    homeric's Avatar
    New User
    Status
    Offline
    Join Date
    Apr 2007
    Posts
    4

    Unhappy Table Sizing Problem

    Hi
    I've created a table whith 7 rows & 2 columns - Row1 spans both columns
    Row2 spans 6 rows & contains a graphic
    Rows 3,4,5,6,7 have text in Col2 only
    The whole table is too tall - the entries in Col2 have too much space in them, but no attempts to introduce height stipulations make any difference - Has anyone any ideas please?
    Reply With Quote Reply With Quote
  2. 04-08-2007, 02:03 AM #2
    vinyl-junkie
    vinyl-junkie is offline
    vinyl-junkie's Avatar
    Moderator
    Status
    Offline
    Join Date
    Sep 2005
    Posts
    721

    Re: Table Sizing Problem

    Post your code. Also, what browser are you using; e.g., IE6, IE7, Firefox?
    Music Around The World - Collecting tips, trade
    and want lists, album reviews, & more
    Reply With Quote Reply With Quote
  3. 04-08-2007, 03:48 AM #3
    homeric
    homeric is offline
    homeric's Avatar
    New User
    Status
    Offline
    Join Date
    Apr 2007
    Posts
    4

    Red face Re: Table Sizing Problem

    Vinyl-junkie here's the code:-
    Code:
    <Table border=3 width="100%" height="10%" cellspacing="0" cellpadding="0" valign="bottom">
<TR><TD width="30%" colspan="2" nowrap><H1>This is Angus's Photo Book</H1></TD></TR>
<TR>
<TD height="15%" rowspan="7" width=70% nowrap><a onMouseOver="changer('img3',4)" onMouseOut="changer('img3',3)" 
href="javascript:void"><img name="img3" border="0" vspace="0" hspace="0" src="Project01A2.jpg" alt="Grenada Scenes" 
width=750 height=135></a></TR>
<TR><TD nowrap><H3><p onMouseOut="this.style.color = 'black';" onMouseOver="this.style.color = 'blue'" onClick="parent.location='Book.htm'" /p>Book</H3></TD></TR>
<TR><TD nowrap><H3><p onMouseOut="this.style.color = 'black';" onMouseOver="this.style.color = 'blue'" onClick="parent.location='PhotoGalleries.htm'" /p>Photo Galleries</H3></TD></TR>
<TR><TD nowrap><H3><p onMouseOut="this.style.color = 'black';" onMouseOver="this.style.color = 'blue'" onClick="parent.location='contact.htm'" /p>Contact</H3></TD></TR>
<TR><TD nowrap><H3><p onMouseOut="this.style.color = 'black';" onMouseOver="this.style.color = 'blue'" onClick="parent.location='OrderingPage.htm'"/p>How To Order</H3></TD></TR>
<TR><TD nowrap><H3><p onMouseOut="this.style.color = 'black';" onMouseOver="this.style.color = 'blue'" onClick="parent.location='PaymentPage.htm'"/p>How To Pay</H3></TD></TR>
</Table>
    Here's the shape of what the finished product should be (note deep cells in column 2 - this is the problem - it's forcing the finished screen to require scrolling):-
    http://www.petesweb.org.uk/tableview.htm
    Last edited by HTML; 03-08-2012 at 04:09 PM. Reason: Added Code Tags
    Reply With Quote Reply With Quote
  4. 04-08-2007, 04:18 AM #4
    homeric
    homeric is offline
    homeric's Avatar
    New User
    Status
    Offline
    Join Date
    Apr 2007
    Posts
    4

    Re: Table Sizing Problem

    Hi Vinyl-junkie forgot to answer about browser - I'm using IE7
    Thanks Homeric
    Reply With Quote Reply With Quote
  5. 04-08-2007, 01:46 PM #5
    vinyl-junkie
    vinyl-junkie is offline
    vinyl-junkie's Avatar
    Moderator
    Status
    Offline
    Join Date
    Sep 2005
    Posts
    721

    Re: Table Sizing Problem

    Here are some thoughts about how to fix this. The first thing you should always do is make sure you have a doctype at the top of every web page. Secondly, you need to make sure your web page passes W3C validation. After that, fix your display problems.

    I use a web page editor called 1stPage2000, which also has a feature called HTML Tidy, which cleans up the code as much as it can. Here's what I came up with after doing that (and manually indenting nested elements. Note: There are still a handful of validation errors with this code.):

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Test Page</title>
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="generator" content="CuteHTML">
</head>
<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#800080">
<!--Don't forget to add your FREE HitBOX statistics to your web page. To
do so, click on Online Services\HitBox Statistics...-->
<table border="3" width="100%" height="10%" cellspacing="0" cellpadding="0" valign="bottom">
<tr>
	<td width="30%" colspan="2" nowrap>
	<h1>This is Angus's Photo Book</h1>
	</td>
</tr>

<tr>
	<td height="15%" rowspan="7" width="70%" nowrap>
	<a onmouseover="changer(img3,4)" onmouseout="changer(img3,3)" href="javascript:void">
	<img name="img3" border="0" vspace="0" hspace="0" src="Project01A2.jpg" alt="Grenada Scenes" width="750" height="135"></a>
	</td>
</tr>

<tr>
	<td nowrap>
	<p onmouseout="this.style.color = black;" onmouseover="this.style.color = blue" onclick="parent.location=Book.htm">Book</p>
	</td>
</tr>

<tr>
	<td nowrap>
	<p onmouseout="this.style.color = black;" onmouseover="this.style.color = blue" 
	onclick="parent.location=PhotoGalleries.htm">Photo Galleries</p>
	</td>
</tr>

<tr>
	<td nowrap>
	<p onmouseout="this.style.color = black;" onmouseover="this.style.color = blue" 
	onclick="parent.location=contact.htm">Contact</p>
</td>
</tr>

<tr>
	<td nowrap>
	<p onmouseout="this.style.color = black;" onmouseover="this.style.color = blue" 
	onclick="parent.location=OrderingPage.htm">How To Order</p>
	</td>
</tr>

<tr>
	<td nowrap>
	<p onmouseout="this.style.color = black;" onmouseover="this.style.color = blue" 
	onclick="parent.location=PaymentPage.htm">How To Pay</p>
	</td>
</tr>
</table>
</body>
</html>
    I didn't compare everything here to your original code, but I caught one glaring mistake that you seem to repeat consistently throughout your code. In your original code, for example, you have:

    Code:
    <TR><TD nowrap><H3><p onMouseOut="this.style.color = 'black';" onMouseOver="this.style.color = 'blue'" onClick="parent.location='Book.htm'" /p>Book</H3></TD></TR>
    But you didn't close your paragraph tag. This code should look like this:

    Code:
    <tr>
<td nowrap>
<p onmouseout="this.style.color = black;" onmouseover="this.style.color = blue" onclick="parent.location=Book.htm">Book</p>
</td>
</tr>
    I'm sure that isn't the only thing wrong with the HTML, but you can compare your version to mine to see all the differences.

    BTW, you have some javascript errors. Don't know what's up with that, but looks like you still have a bit to fix with this.
    Music Around The World - Collecting tips, trade
    and want lists, album reviews, & more
    Reply With Quote Reply With Quote
  6. 04-09-2007, 03:16 AM #6
    homeric
    homeric is offline
    homeric's Avatar
    New User
    Status
    Offline
    Join Date
    Apr 2007
    Posts
    4

    Smile Re: Table Sizing Problem

    Thanks Vinyl-junkie for your prompt response - I'll look into what you had to say - Homeric
    Reply With Quote Reply With Quote
  7. 05-09-2007, 11:23 AM #7
    jesse1
    jesse1 is offline
    jesse1's Avatar
    New User
    Status
    Offline
    Join Date
    Mar 2007
    Posts
    8

    Re: Table Sizing Problem

    I find the best way to set table sizes is with CSS tags. works great and you can also set border colors, cell spacing etc...


    Reply With Quote Reply With Quote
« Previous Thread | Next Thread »

Tags for this Thread