problem setting heigh for tables within table

J

José Joye

Hello,

I'm trying to design 3 rectangles with borders (placed next to each other)
that will be displayed on my page. Within these rectangles, I would like to
write some text.
The problem I have is that I do not know how to force the high of these
boxes to be the same.
They are currently sized independently from each other and based on the text
written inside.

I have done the following:

1 table with 1 row and 5 cells
Within cells 1, 3 and 5, I have created 1 table with 1 row and 1 cell
For each of them I set the high to 100%

Is this the correct way?

Thanks,
José

Page snippet:
=========
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>New Page 1</title>
<meta name="GENERATOR" content="Microsoft FrontPage 6.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
</head>

<body>
<table border="0" width="540" cellspacing="0" cellpadding="0">
<tr>
<td width="30%">
<table border="1" width="100%" height="100%" cellspacing="0"
cellpadding="0">
<tr>
<td>1<p>1</p>
<p>1</p>
<p>&nbsp;</td>
</tr>
</table>
</td>
<td width="5%">&nbsp;
</td>
<td width="30%">
<table border="1" width="100%" height="100%" cellspacing="0"
cellpadding="0" >
<tr>
<td>2</td>
</tr>
</table>
</td>
<td width="5%">&nbsp;</td>
<td width="30%">
<table border="1" width="100%" height="100%" cellspacing="0"
cellpadding="0">
<tr>
<td>3<p>3</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
 
S

Stefan B Rusynko

That's the way tables work
- sizes are minimum and expand to fit content
Best you can do if it is critical is to apply a height to the outer table
- not globally supported by all browsers

<body>
<table border="0" width="540" height="500" cellspacing="0" cellpadding="0">

or
<table border="0" width="540" height="100%" cellspacing="0" cellpadding="0">
(not recommended to mix px and % but it is supported by IE consistently)

Better way would be to use a spacer image in the 2 empty "spacer" cells of a minimum fixed height to make the tables all look the
same

--




| Hello,
|
| I'm trying to design 3 rectangles with borders (placed next to each other)
| that will be displayed on my page. Within these rectangles, I would like to
| write some text.
| The problem I have is that I do not know how to force the high of these
| boxes to be the same.
| They are currently sized independently from each other and based on the text
| written inside.
|
| I have done the following:
|
| 1 table with 1 row and 5 cells
| Within cells 1, 3 and 5, I have created 1 table with 1 row and 1 cell
| For each of them I set the high to 100%
|
| Is this the correct way?
|
| Thanks,
| José
|
| Page snippet:
| =========
| <html>
|
| <head>
| <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
| <title>New Page 1</title>
| <meta name="GENERATOR" content="Microsoft FrontPage 6.0">
| <meta name="ProgId" content="FrontPage.Editor.Document">
| </head>
|
| <body>
| <table border="0" width="540" cellspacing="0" cellpadding="0">
| <tr>
| <td width="30%">
| <table border="1" width="100%" height="100%" cellspacing="0"
| cellpadding="0">
| <tr>
| <td>1<p>1</p>
| <p>1</p>
| <p>&nbsp;</td>
| </tr>
| </table>
| </td>
| <td width="5%">&nbsp;
| </td>
| <td width="30%">
| <table border="1" width="100%" height="100%" cellspacing="0"
| cellpadding="0" >
| <tr>
| <td>2</td>
| </tr>
| </table>
| </td>
| <td width="5%">&nbsp;</td>
| <td width="30%">
| <table border="1" width="100%" height="100%" cellspacing="0"
| cellpadding="0">
| <tr>
| <td>3<p>3</td>
| </tr>
| </table>
| </td>
| </tr>
| </table>
| </body>
|
|
 
J

José Joye

Your solution with spacer sounds more elegant. However, I'm not sure how to
go ahead. Where can I find some more details?

Thanks,
José
Stefan B Rusynko said:
That's the way tables work
- sizes are minimum and expand to fit content
Best you can do if it is critical is to apply a height to the outer table
- not globally supported by all browsers

<body>
<table border="0" width="540" height="500" cellspacing="0" cellpadding="0">

or
<table border="0" width="540" height="100%" cellspacing="0" cellpadding="0">
(not recommended to mix px and % but it is supported by IE consistently)

Better way would be to use a spacer image in the 2 empty "spacer" cells of
Click to expand...
a minimum fixed height to make the tables all look the
 
S

Stefan B Rusynko

If you know your content will always be X pixels high - say 400px
Just create a transparent .gif file say 10px wide by 10px high to insert in your 5% spacer cells in the outer table and select the
image for Picture Properties to set the height of the .gif to 400 px high (select don't retain proportions)
Note

This approach will not work if your text content is resizable by user in browser (View text size +/-)

--




| Your solution with spacer sounds more elegant. However, I'm not sure how to
| go ahead. Where can I find some more details?
|
| Thanks,
| José
| | > That's the way tables work
| > - sizes are minimum and expand to fit content
| > Best you can do if it is critical is to apply a height to the outer table
| > - not globally supported by all browsers
| >
| > <body>
| > <table border="0" width="540" height="500" cellspacing="0"
| cellpadding="0">
| >
| > or
| > <table border="0" width="540" height="100%" cellspacing="0"
| cellpadding="0">
| > (not recommended to mix px and % but it is supported by IE consistently)
| >
| > Better way would be to use a spacer image in the 2 empty "spacer" cells of
| a minimum fixed height to make the tables all look the
| > same
| >
| > --
| >
| > _____________________________________________
| > SBR @ ENJOY (-: [ Microsoft MVP - FrontPage ]
| > "Warning - Using the F1 Key will not break anything!" (-;
| > To find the best Newsgroup for FrontPage support see:
| > http://www.net-sites.com/sitebuilder/newsgroups.asp
| > _____________________________________________
| >
| >
| | > | Hello,
| > |
| > | I'm trying to design 3 rectangles with borders (placed next to each
| other)
| > | that will be displayed on my page. Within these rectangles, I would like
| to
| > | write some text.
| > | The problem I have is that I do not know how to force the high of these
| > | boxes to be the same.
| > | They are currently sized independently from each other and based on the
| text
| > | written inside.
| > |
| > | I have done the following:
| > |
| > | 1 table with 1 row and 5 cells
| > | Within cells 1, 3 and 5, I have created 1 table with 1 row and 1
| cell
| > | For each of them I set the high to 100%
| > |
| > | Is this the correct way?
| > |
| > | Thanks,
| > | José
| > |
| > | Page snippet:
| > | =========
| > | <html>
| > |
| > | <head>
| > | <meta http-equiv="Content-Type" content="text/html;
| charset=windows-1252">
| > | <title>New Page 1</title>
| > | <meta name="GENERATOR" content="Microsoft FrontPage 6.0">
| > | <meta name="ProgId" content="FrontPage.Editor.Document">
| > | </head>
| > |
| > | <body>
| > | <table border="0" width="540" cellspacing="0" cellpadding="0">
| > | <tr>
| > | <td width="30%">
| > | <table border="1" width="100%" height="100%" cellspacing="0"
| > | cellpadding="0">
| > | <tr>
| > | <td>1<p>1</p>
| > | <p>1</p>
| > | <p>&nbsp;</td>
| > | </tr>
| > | </table>
| > | </td>
| > | <td width="5%">&nbsp;
| > | </td>
| > | <td width="30%">
| > | <table border="1" width="100%" height="100%" cellspacing="0"
| > | cellpadding="0" >
| > | <tr>
| > | <td>2</td>
| > | </tr>
| > | </table>
| > | </td>
| > | <td width="5%">&nbsp;</td>
| > | <td width="30%">
| > | <table border="1" width="100%" height="100%" cellspacing="0"
| > | cellpadding="0">
| > | <tr>
| > | <td>3<p>3</td>
| > | </tr>
| > | </table>
| > | </td>
| > | </tr>
| > | </table>
| > | </body>
| > |
| > |
| >
| >
|
|
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

How to export table from outlook into ms access table? 0
Sript error when previewing page. 4
Frontpage template ?? 1
Adsense breaks Frontpage 6
pages don't work in Firefox? 2
"open or save" message when opening an ASP form from either IE or FF1.5 1
Adding text over a graphic image 4
Page format 1

Top