Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6

Thread: Table height

  1. #1
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Table height

    Greetings

    I have a problem.. I want 2 tables, and one should be above the other so we have table1 and table2

    height table1: 130px
    height table2: until the end of the screen..

    I don't know how to fix the table2 height

    here is my code (not nice coded but you'lll get the idea):

    <div id="header" align="center">
    <table width="100%" border="0" cellspacing="0" cellpadding="0">
    <tr>
    <td>
    <table id="table1" width="800" height="130" border="0" cellpadding="0" cellspacing="0" align="center">
    <tr>
    <td rowspan="3"> <img src="images/Untitled-4_01.jpg" width="363" height="130" alt=""></td>
    <td rowspan="3"> <img src="images/Untitled-4_02.jpg" width="11" height="130" alt=""></td>
    <td rowspan="3"> <img src="images/Untitled-4_03.jpg" width="156" height="130" alt=""></td>
    <td colspan="8"> <img src="images/Untitled-4_04.jpg" width="270" height="104" alt=""></td>
    </tr>
    <tr>
    <td> <a href="?p=weblog"><img src="images/Untitled-4_05.jpg" width="58" height="17" alt="" border="0"></a></td>
    <td rowspan="2"> <img src="images/Untitled-4_06.jpg" width="11" height="26" alt=""></td>
    <td> <a href="?p=portfolio"><img src="images/Untitled-4_07.jpg" width="71" height="17" alt="" border="0"></a></td>
    <td rowspan="2"> <img src="images/Untitled-4_08.jpg" width="10" height="26" alt=""></td>
    <td> <a href="?p=links"><img src="images/Untitled-4_09.jpg" width="36" height="17" alt="" border="0"></a></td>
    <td rowspan="2"> <img src="images/Untitled-4_10.jpg" width="13" height="26" alt=""></td>
    <td> <a href="?p=contact"><img src="images/Untitled-4_11.jpg" width="60" height="17" alt="" border="0"></a></td>
    <td rowspan="2"> <img src="images/Untitled-4_12.jpg" width="11" height="26" alt=""></td>
    </tr>
    <tr>
    <td> <img src="images/Untitled-4_13.jpg" width="58" height="9" alt=""></td>
    <td> <img src="images/Untitled-4_14.jpg" width="71" height="9" alt=""></td>
    <td> <img src="images/Untitled-4_15.jpg" width="36" height="9" alt=""></td>
    <td> <img src="images/Untitled-4_16.jpg" width="60" height="9" alt=""></td>
    </tr>
    </table>
    </td>
    </tr>
    </table>
    </div>

    <table id="table2" width="100%" border="0" cellspacing="0" cellpadding="5">
    <tr>
    <td background="images/table2_bgOut.jpg"> </td>
    <td id="table2L" bgcolor="#333333"> </td>
    <td width="800" background="images/table2_bgIn.jpg">
    <? include('content.php'); ?>
    </td>
    <td id="table2R" bgcolor="#333333"> </td>
    <td background="images/table2_bgOut.jpg"> </td>
    </tr>
    </table>
    my stylesheet:

    body {
    margin-left: 0;
    margin-right: 0;
    margin-top: 0;
    margin-bottom: 0;
    }

    #header {
    width: 100%;
    background-image:url('images/Untitled-4_02.jpg');
    height: 130;
    }

    #table2L {
    background-image:url('images/table2_bgL.jpg');
    background-position: top right;
    background-repeat: repeat-y;
    }

    #table2R {
    background-image:url('images/table2_bgR.jpg');
    background-position: top left;
    background-repeat: repeat-y;
    }

    #table2 {
    height: ???????
    }
    already thank you for looking at this topic!

  • #2
    New Coder
    Join Date
    Jun 2007
    Location
    Quebec, Canada
    Posts
    64
    Thanks
    4
    Thanked 3 Times in 3 Posts
    hi, the fastest way to fix it was to add this in your stylesheet

    Code:
    html,body {
    height:100%
    }
    and setting your table2 height to 100%
    Code:
    #table2 {
    height:100%
    }
    the problem is, the browser is calculating 100% of the body + your other table being 130px

    if your header doesnt have any gif, you could use the table2 as a "full" table with a row on the top including your 130px header

  • #3
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thnx for the reply i'll try this tomorrow to tired now

    but thanks for the help

  • #4
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    it didnt work

    the same result as before after adding the things you said

    here is the result: http://www.tehvuune.be/testsite/
    (stylesheet: http://www.tehvuune.be/testsite/style.css)

  • #5
    Regular Coder BWiz's Avatar
    Join Date
    Mar 2006
    Location
    Sol System
    Posts
    471
    Thanks
    7
    Thanked 21 Times in 21 Posts
    Firstly, view this: http://codingforums.com/showpost.php...20&postcount=2
    A CSS layout would be better anyday over a tabular one. I suggest that you upgrade. If you need practice go here: http://www.w3schools.com/css/css_positioning.asp
    BWiz :: Happy Coding!
    2006
    2007 2008 2009
    2010 2011
    Irrational numbers make no sense.

  • #6
    New to the CF scene
    Join Date
    Jul 2007
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Nevermind i fixed it:

    I take a screenshot of the gray part and putted it als my background :-) bit messy but effect is perfect thanks for help !


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •