Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > HTML Table Question

Reply
Thread Tools

HTML Table Question

 
 
NvrBst
Guest
Posts: n/a
 
      01-10-2008
This is probably a basic question but seems to be hard for me to find.

How do you tell a cell to take up all the vertical space it can? (By
default the 1st cell does it but I want the 3rd to). style="height:
100%;" doesn't work and can't find a "vertical-align:justify;"
option. Below is what my table looks like.

1 2
3 4
5 6

1/3/5 are all merged with rowspan=2. Cell 2 has to fit its data.
Cell 4 has to be right under Cell 2 always. I want Cell 6 to take up
any extra room with blank space so that Cell 1 or 4 arn't stretched
(Cell 4 has special background).


Note:
1 2
3 4

This situation would also be fine (1/3 merged). It works the way I
want it to when Cell 2 is higher than the data in 1/3. But when data
in Cell 2 is small then Cell 2 gets stretched which I'd like to
advoid.

Thanks

NB
 
Reply With Quote
 
 
 
 
dorayme
Guest
Posts: n/a
 
      01-11-2008
In article
<(E-Mail Removed)
m>,
NvrBst <(E-Mail Removed)> wrote:

> This is probably a basic question but seems to be hard for me to find.
>
> How do you tell a cell to take up all the vertical space it can? (By
> default the 1st cell does it but I want the 3rd to). style="height:
> 100%;" doesn't work and can't find a "vertical-align:justify;"
> option. Below is what my table looks like.
>
> 1 2
> 3 4
> 5 6
>
> 1/3/5 are all merged with rowspan=2. Cell 2 has to fit its data.
> Cell 4 has to be right under Cell 2 always. I want Cell 6 to take up
> any extra room with blank space so that Cell 1 or 4 arn't stretched
> (Cell 4 has special background).
>
>
> Note:
> 1 2
> 3 4
>
> This situation would also be fine (1/3 merged). It works the way I
> want it to when Cell 2 is higher than the data in 1/3. But when data
> in Cell 2 is small then Cell 2 gets stretched which I'd like to
> advoid.
>



Excuse me while I pray:

Dearest God Almighty, greatest of all HTML authors, Please make a
subscriber who has a complicated question supply a f*ing url.
thank you.

PS. And wipe all those tut tuts from the faces of your most
faithful servants.

--
dorayme
 
Reply With Quote
 
 
 
 
Travis Newbury
Guest
Posts: n/a
 
      01-11-2008
On Jan 10, 7:13 pm, dorayme <(E-Mail Removed)> wrote:
> Excuse me while I pray:
> Dearest God Almighty, greatest of all HTML authors, Please make a
> subscriber who has a complicated question supply a f*ing url.
> thank you.


Whats a flying url?
 
Reply With Quote
 
NvrBst
Guest
Posts: n/a
 
      01-11-2008
On Jan 10, 4:13*pm, dorayme <(E-Mail Removed)> wrote:
> In article
> <(E-Mail Removed)
> m>,
>
>
>
>
>
> *NvrBst <(E-Mail Removed)> wrote:
> > This is probably a basic question but seems to be hard for me to find.

>
> > How do you tell a cell to take up all the vertical space it can? (By
> > default the 1st cell does it but I want the 3rd to). *style="height:
> > 100%;" doesn't work and can't find a "vertical-align:justify;"
> > option. *Below is what my table looks like.

>
> > 1 2
> > 3 4
> > 5 6

>
> > 1/3/5 are all merged with rowspan=2. *Cell 2 has to fit its data.
> > Cell 4 has to be right under Cell 2 always. *I want Cell 6 to take up
> > any extra room with blank space so that Cell 1 or 4 arn't stretched
> > (Cell 4 has special background).

>
> > Note:
> > 1 2
> > 3 4

>
> > This situation would also be fine (1/3 merged). *It works the way I
> > want it to when Cell 2 is higher than the data in 1/3. *But when data
> > in Cell 2 is small then Cell 2 gets stretched which I'd like to
> > advoid.

>
> Excuse me while I pray:
>
> Dearest God Almighty, greatest of all HTML authors, Please make a
> subscriber who has a complicated question supply a f*ing url.
> thank you.
>
> PS. And wipe all those tut tuts from the faces of your most
> faithful servants.
>
> --
> dorayme- Hide quoted text -
>
> - Show quoted text -


Hehe sorry don't have a URL yet... I was able to acomplish what I
want by seperating column 1 and column 2 into 2 seperate tables and
then putting both tables into a new table. If someone has a more
elegant solution please tell. Below is how my solution looks like in
code form if it helps

<table style:"vertial-align: top;"><tr>
<td> <table><tr><td>*Menu*</td></tr></table> </td>
<td> <table><tr><td>*Data1*</td></tr><tr><td>*Data2*</td></tr></
table> </td>
</tr></table>


Using 3 tables isn't that elegant though... This is what I'd like it
to look like, what it was before (In code form)
<table>
<tr>
<td rowspan="3">*Menu*</td>
<td>*Data1*</td>
</tr>
<tr><td>*Data2*</td></tr>
<tr><td style="vertial-align:justify;"></td></tr>
</table>

What doesn't work in the this way is the "vertical-align:justify;"
line. I've tried setting the cells above it to "height: auto;" (which
is suppose to give it the min size they can be) and then leaving the
last cell with no height set but that didn't work either.

NB
 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      01-11-2008
dorayme wrote:

> Excuse me while I pray:
>
> Dearest God Almighty, greatest of all HTML authors, Please make a
> subscriber who has a complicated question supply a f*ing url.
> thank you.


Hallelujah!

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
dorayme
Guest
Posts: n/a
 
      01-11-2008
In article
<(E-Mail Removed)
m>,
Travis Newbury <(E-Mail Removed)> wrote:

> On Jan 10, 7:13 pm, dorayme <(E-Mail Removed)> wrote:
> > Excuse me while I pray:
> > Dearest God Almighty, greatest of all HTML authors, Please make a
> > subscriber who has a complicated question supply a f*ing url.
> > thank you.

>
> Whats a flying url?


I reckon this is a trick question.

--
dorayme
 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      01-11-2008
NvrBst wrote:

> Hehe sorry don't have a URL yet...


Well you can upload an example. Use your ISP's personal webspace or some
free server...

I was able to acomplish what I
> want by seperating column 1 and column 2 into 2 seperate tables and
> then putting both tables into a new table. If someone has a more
> elegant solution please tell. Below is how my solution looks like in
> code form if it helps
>
> <table style:"vertial-align: top;"><tr>
> <td> <table><tr><td>*Menu*</td></tr></table> </td>
> <td> <table><tr><td>*Data1*</td></tr><tr><td>*Data2*</td></tr></
> table> </td>
> </tr></table>
>
>
> Using 3 tables isn't that elegant though... This is what I'd like it
> to look like, what it was before (In code form)
> <table>
> <tr>
> <td rowspan="3">*Menu*</td>
> <td>*Data1*</td>
> </tr>
> <tr><td>*Data2*</td></tr>
> <tr><td style="vertial-align:justify;"></td></tr>
> </table>
>
> What doesn't work in the this way is the "vertical-align:justify;"
> line. I've tried setting the cells above it to "height: auto;" (which
> is suppose to give it the min size they can be) and then leaving the
> last cell with no height set but that didn't work either.



1) There is no value "justify" for property "vertical-align". Valid values:

baseline | sub | super | top | text-top | middle | bottom | text-bottom
| <percentage> | <length> | inherit


Anyway if you wish to duplicate your three table layout with one, then
you need colspan 2 not 3

<table>
<tr><td rowspan="2">*Menu*</td><td>*Data1*</td></tr>
<tr><td>*Data2*</td></tr>
</table>


--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
dorayme
Guest
Posts: n/a
 
      01-11-2008
In article
<(E-Mail Removed)
>,

NvrBst <(E-Mail Removed)> wrote:

> On Jan 10, 4:13*pm, dorayme:


> > Excuse me while I pray:
> >

>
> Hehe sorry don't have a URL yet... I was able to acomplish what I
> want by seperating column 1 and column 2 into 2 seperate tables and
> then putting both tables into a new table. If someone has a more
> elegant solution please tell. Below is how my solution looks like in
> code form if it helps
>
> <table style:"vertial-align: top;"><tr>
> <td> <table><tr><td>*Menu*</td></tr></table> </td>
> <td> <table><tr><td>*Data1*</td></tr><tr><td>*Data2*</td></tr></
> table> </td>
> </tr></table>
>
>
> Using 3 tables isn't that elegant though... This is what I'd like it
> to look like, what it was before (In code form)
> <table>
> <tr>
> <td rowspan="3">*Menu*</td>
> <td>*Data1*</td>
> </tr>
> <tr><td>*Data2*</td></tr>
> <tr><td style="vertial-align:justify;"></td></tr>
> </table>
>
> What doesn't work in the this way is the "vertical-align:justify;"
> line. I've tried setting the cells above it to "height: auto;" (which
> is suppose to give it the min size they can be) and then leaving the
> last cell with no height set but that didn't work either.
>


This the sort of thing you want:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

<html>
<head>
<title>test</title>
<style type="text/css">
table {border-collapse: collapse;}
td {padding: 1em; border:1px solid;}
h1 {font-size: 1.2em; margin-top: 0; padding-top: 0;}
</style>
</head>

<body>
<table>
<tr>
<td rowspan="2" >
<h1>Menu</h1>
<ul>
<li>menu item</li>
<li>menu item</li>
<li>menu item</li>
<li>menu item</li>
<li>menu item</li>
<li>menu item</li>
<li>menu item</li>
<li>menu item</li>
</ul>
</td>
<td>*Data1*</td></tr>
<tr><td>*Data2*</td></tr>
</table>

</body>
</html>

?

I don't see why I should be the sucker all the time who supplies
the urls <g>

--
dorayme
 
Reply With Quote
 
NvrBst
Guest
Posts: n/a
 
      01-11-2008
On Jan 10, 4:53*pm, "Jonathan N. Little" <(E-Mail Removed)>
wrote:
> NvrBst wrote:
> > Hehe sorry don't have a URL yet... *

>
> Well you can upload an example. Use your ISP's personal webspace or some
> free server...
>
> I was able to acomplish what I
>
>
>
>
>
> > want by seperating column 1 and column 2 into 2 seperate tables and
> > then putting both tables into a new table. *If someone has a more
> > elegant solution please tell. *Below is how my solution looks like in
> > code form if it helps

>
> > <table style:"vertial-align: top;"><tr>
> > <td> *<table><tr><td>*Menu*</td></tr></table> *</td>
> > <td> *<table><tr><td>*Data1*</td></tr><tr><td>*Data2*</td></tr></
> > table> *</td>
> > </tr></table>

>
> > Using 3 tables isn't that elegant though... *This is what I'd like it
> > to look like, what it was before (In code form)
> > <table>
> > <tr>
> > <td rowspan="3">*Menu*</td>
> > <td>*Data1*</td>
> > </tr>
> > <tr><td>*Data2*</td></tr>
> > <tr><td style="vertial-align:justify;"></td></tr>
> > </table>

>
> > What doesn't work in the this way is the "vertical-align:justify;"
> > line. *I've tried setting the cells above it to "height: auto;" (which
> > is suppose to give it the min size they can be) and then leaving the
> > last cell with no height set but that didn't work either.

>
> 1) There is no value "justify" for property "vertical-align". Valid values:
>
> baseline | sub | super | top | text-top | middle | bottom | text-bottom
> | <percentage> | <length> | inherit
>
> Anyway if you wish to duplicate your three table layout with one, then
> you need colspan 2 not 3
>
> <table>
> <tr><td rowspan="2">*Menu*</td><td>*Data1*</td></tr>
> <tr><td>*Data2*</td></tr>
> </table>
>
> --
> Take care,
>
> Jonathan
> -------------------
> LITTLE WORKS STUDIOhttp://www.LittleWorksStudio.com- Hide quoted text -
>
> - Show quoted text -



The Example I gave above was this though (So I think I'd need
rowspan=3).
<table>
<tr><td rowspan="3">*Menu*</td> <td>*Data1*</td> </tr>
<tr><td>*Data2*</td></tr>
<tr><td style="vertial-align:justify;"></td></tr>
</table>

I need the "vertial-align:justify;" cell so that vertical stretching
doesn't occur in the *Data1* and *Data2* cells. I know there is no
justify for vertical alignment but I stated it because that is the
kind of effect I need.

If I use your example (using rowspan=2) then I'd have the problem (as
labled in the inital post) of *Data2* cell being stretched when *Data1*
+*Data2* height is less than *Menu*

NB
 
Reply With Quote
 
Jonathan N. Little
Guest
Posts: n/a
 
      01-11-2008
NvrBst wrote:

> I need the "vertial-align:justify;" cell so that vertical stretching
> doesn't occur in the *Data1* and *Data2* cells. I know there is no
> justify for vertical alignment but I stated it because that is the
> kind of effect I need.
>
> If I use your example (using rowspan=2) then I'd have the problem (as
> labled in the inital post) of *Data2* cell being stretched when *Data1*
> +*Data2* height is less than *Menu*


Maybe what the real problem is that you are using a table for layout
when you should be using something else. If you rowspan the left column
cell and the right column you add data that expand the cells vertically
it is "natural" table behavior for the left column rowspan'ed cell to
also expand vertically

Now looking into my crystal ball I see that the left cell you put the
word "menu" so chances are you have a *list* of menu items. If it a list
you should use a list! If you want it side by side with your data then
float it left. Google "2 column css layout template"

--
Take care,

Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
html table control vs web table control Geary ASP .Net 2 07-12-2007 12:12 AM
CSS table don't look like html TABLE vitay HTML 8 11-09-2006 05:56 PM
difference between html table and asp:table Beffmans ASP .Net 1 07-08-2005 12:07 PM
Table/table rows/table data tag question? Rio HTML 4 11-05-2004 08:11 AM
Could not load type VTFixup Table from assembly Invalid token in v-table fix-up table. David Williams ASP .Net 2 08-12-2003 07:55 AM



Advertisments