White space problem (table)

[chrisoftoday@googlemail.com]

Hi,

I'm having trouble with some white space that's appearing in my table.
I can't seem to spot the problem, it'd be great if someone could help.
The HTML code (ignore the PHP, it shouldn't be an issue) I'm using to
create the table is...

<table align="center" cellpadding="5" width="650" border="1">
<tr>
<td width="100">
<img src="<? echo $imgPath; ?>" width="100" height="130"/>
</td>
<td valign="top">
Title: <? echo $title; ?>
<br />Year: <? echo $year; ?>
<br />Certificatio n: <? echo $cert; ?>
</td>
</tr>
<tr>
<td colspan="2"><br /><br />Sypnosis: <p /><? echo $syp; ?></td>
</tr>
<tr>
<td colspan="2">
<br /><br /><a href="addtobask et.php?movID=<? echo $movID;
?>&movTitle=<? echo urlencode($titl e); ?>">Add to basket</a>
<br /><br /><a href="javascrip t: history.go(-1)">Back</a>
</td>
</tr>
</table>


I've taken a screenshot of the output from this code -

http://img.photobucket.com/albums/v25/impey/htmlproblem.jpg

I'm unsure as to what is causing the whitespace in the top left cell. I
need the text in the top right cell to be sitting up against the image.
I do have a table entry in my CSS file but the only attributes it
specifies are font-size, font-family and color.

Thanks.

[Jukka K. Korpela]

Re: White space problem (table)

chrisoftoday@go oglemail.com wrote:
[color=blue]
> The HTML code (ignore the PHP, it shouldn't be an issue) I'm using to
> create the table is...[/color]

Why don't you post the URL so that we could see the actual problem?
[color=blue]
> I've taken a screenshot of the output from this code -[/color]

Why don't you post the URL so that we could see the actual problem?

--
Yucca, http://www.cs.tut.fi/~jkorpela/
Pages about Web authoring: http://www.cs.tut.fi/~jkorpela/www.html

[Andy Dingley]

Re: White space problem (table)

chrisoftoday@go oglemail.com wrote:
[color=blue]
> I'm having trouble with some white space that's appearing in my table.[/color]

Then don't use a table.
[color=blue]
> I can't seem to spot the problem,[/color]

How do you expect us to do any better - you didn't even post the URL.

[chrisoftoday@googlemail.com]

Re: White space problem (table)

I posted a screenshot and the code. I can give you the URL but it wont
work because the server doesn't allow public access.

[chrisoftoday@googlemail.com]

Re: White space problem (table)

http://much.cs.nott.ac.uk/~cxi03u/cgi-bin/IDS/browse.php?movID=101

.... if it makes you feel better.

[Arne]

Re: White space problem (table)

Once upon a time *chrisoftoday@g ooglemail.com* wrote:[color=blue]
> I posted a screenshot and the code. I can give you the URL but it
> wont work because the server doesn't allow public access.
>[/color]

Who are you talking to?

How to quote: http://www.netmeister.org/news/learn2quote.html#toc2
From Google: http://www.safalra.com/special/googlegroupsreply/

--
/Arne

- "I travel cross the country and talked to the most competent persons,
and I can assure you that the computer is a fashion craze that will not
stand the whole year". (Editor for business literature, Prentice Hall, 1957)

[cis148@yahoo.com]

Re: White space problem (table)

IE is ignoring your 100px table cell width once you added the second TR
with a sufficient amount of text into the col-spanning TD. Try it
again with a synopsis of a few characters and you'll see what I mean.

Since you're using a table-based layout here, you might consider using
a table-within-a-table approach to avoid the browser guessing at the
best split point, e.g.

<table>
<tr>
<td>
<table>
<tr>
<td width=100>img</td>
<td>title year cert</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>synopsis</td>
</tr>
<tr>
<td>links</td>
</tr>
</table>

Style as necessary. Yucky,
Yucky Korpulent

[Neredbojias]

Re: White space problem (table)

To further the education of mankind, cis148@yahoo.co m declaimed:
[color=blue]
> Since you're using a table-based layout here, you might consider using
> a table-within-a-table approach to avoid the browser guessing at the
> best split point, e.g.[/color]

Or how about just floating the image left?

--
Neredbojias
Apprentice Learner

[Gérard Talbot]

Re: White space problem (table)

chrisoftoday@go oglemail.com wrote :[color=blue]
> Hi,
>
> I'm having trouble with some white space that's appearing in my table.
> I can't seem to spot the problem, it'd be great if someone could help.
> The HTML code (ignore the PHP, it shouldn't be an issue) I'm using to
> create the table is...
>
> <table align="center" cellpadding="5" width="650" border="1">
> <tr>
> <td width="100">
> <img src="<? echo $imgPath; ?>" width="100" height="130"/>[/color]


Table cell = left cell padding + image width + rigth cell padding
100px = 5px + 100px + 5px

That is the equation your code is putting to/asking rendering browsers.
Your problem is that your code over-constrains the table and table
cells: this is a very very common problem with people using or abusing
table.

Here, I'd say that your table data is not tabular data. You use table
for laying out the info when the info is not tabular.

[color=blue]
> </td>
> <td valign="top">
> Title: <? echo $title; ?>
> <br />Year: <? echo $year; ?>
> <br />Certificatio n: <? echo $cert; ?>
> </td>
> </tr>
> <tr>
> <td colspan="2"><br /><br />Sypnosis: <p /><? echo $syp; ?></td>
> </tr>
> <tr>
> <td colspan="2">
> <br /><br /><a href="addtobask et.php?movID=<? echo $movID;
> ?>&movTitle=<? echo urlencode($titl e); ?>">Add to basket</a>
> <br /><br /><a href="javascrip t: history.go(-1)">Back</a>[/color]

Do not use "javascript :" pseudo-protocol in a link. The fault with your
code is more grave because you are trying to duplicate the normal
functionality of browser's back button with javascript.

This form of code
<a href="javascrip t: ...">some text</a>
should only and only be used for bookmarklet.

[color=blue]
> </td>
> </tr>
> </table>
>
>
> I've taken a screenshot of the output from this code -
> http://img.photobucket.com/albums/v2...tmlproblem.jpg
>
> I'm unsure as to what is causing the whitespace in the top left cell.[/color]

The default vertical positioning of data in a table cell <td> in all
browsers is middle. Also, your code requested a padding of 5px all
around the table cell.

Use CSS. Not table for positioning non-tabular data.

Table-based webpage design versus CSS-based webpage design: resources,
explanations and tutorials

http://www.gtalbot.org/NvuSection/NvuWebDesignTips/TableVsCSSDesign.html

Gérard
--
remove blah to email me