The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Table not stretching downwards
nibbler
post Feb 25 2007, 05:26 PM
Post #1





Group: Members
Posts: 3
Joined: 25-February 07
Member No.: 2,021



I made a fast example because I can't display the original website yet!

http://www.nibbler.be/test.html (ofc this will be made css valid but its just an example)

the tables with 'tekst' and 'tekst2' should stretch downwards and connect with the gray line on the bottom.

can anybody help me with this?

Thanks

CODE
<table height="100%" border="1" width="50%">
    <tr>
        <td valign="top">
            <table height="100%" border="1" width="100%">
                <tr>
                    <td width="30%" bgcolor="#999999" valign="top" height="100%"><p>tekst</p><p>tekst</p><p>tekst</p><p>tekst</p><p>tekst</p></td>
                    <td valign="top" height="100%"><p>tekst2</p><p>tekst2</p><p>tekst2</p><p>tekst2</p><p>tekst2</p><p>tekst2</p></td>
                </tr>
            </table>
        </td>
        <td valign="top"><p>image</p><p>image</p><p>image</p><p>image</p><p>image</p><p>image</p><p>image</p></td>
    </tr>
    <tr>
        <td colspan="3" bgcolor="#999999" width="100%"> </td>
    </tr>
</table>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Feb 26 2007, 02:59 AM
Post #2


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 15,634
Joined: 9-August 06
Member No.: 6



100% height on the inner table doesn't make sense (to the browser) because 100% height on the outer table doesn't make sense. As you can see the outer table isn't 100% of the viewport. For why and how, read this.
http://web.archive.org/web/20060427091047/...percheight.html


--------------------
"Never go to excess, but let moderation be your guide."
- Cicero

IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
nibbler
post Feb 26 2007, 05:06 PM
Post #3





Group: Members
Posts: 3
Joined: 25-February 07
Member No.: 2,021



thanks but I tried that solution and it messed up some things!

and than at the bottom of the page I read this:

QUOTE
For instance, if you want to make an element as high as the entire page (whatever this height may be) you're out of luck. Although it might seem simple the specs (and the browsers' unthinking conformance) make this completely impossible.

The spec says: "If the height of the containing block is not specified explicitly (i.e., it depends on content height), the value is interpreted like 'auto'."

This means that if you do not define any height at all for the containing block, a percentual height of any contained block doesn't work: the block becomes once again exactly as high as it needs to be.



This post has been edited by nibbler: Feb 26 2007, 05:08 PM
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Feb 27 2007, 03:12 AM
Post #4


Don't like donuts. Don't do MySpace.
********

Group: WDG Moderators
Posts: 15,634
Joined: 9-August 06
Member No.: 6



So what does it mess up?


--------------------
"Never go to excess, but let moderation be your guide."
- Cicero

IPB Image
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
nibbler
post Feb 27 2007, 06:12 AM
Post #5





Group: Members
Posts: 3
Joined: 25-February 07
Member No.: 2,021



woops!
I found out what I did wrong!
well, it wasn't actually messed up. it just stretches the whole outer table (green) to the bottom and that's not what I need!

he needs to stretch the table with 'tekst' and 'tekst2' (red) to the bottom of the outer table (green)

http://www.nibbler.be/test.html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 26th November 2014 - 12:10 AM