table not displaying correctly

Discussion in 'ASP .Net' started by tshad, Apr 27, 2010.

  1. tshad

    tshad Guest

    This now seems to be an html issue, but not sure where to go to check it
    out.

    I have been building my asp.net pages where where I want the table to take
    the whole screen (height 100%) unless it is greater than the size of the
    screen.

    I can get it to work fine except for the table spreading the rows.

    There are 3 rows:
    Top: holds an image or text about 90px height
    Middle: has another table with 2 columns - left has menu and right content.
    Should take up most of the screen and have set at 100%.
    Bottom: the footer (about 39px).

    So the top and bottom are fixed with the middle changing as the use changes
    the size of the screen.

    But the top and bottom are still about the same size as the middle.

    I had to strip out all the asp.net code and css files to get to the lowest
    common denominator.

    *****************************************


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

    <head><title>
    FAQS
    </title><meta http-equiv="content-type" content="application/xhtml+xml;
    charset=UTF-8" />
    <style type="text/css">
    html,
    body {
    height: 100%;
    }

    body {
    margin: 0;
    padding: 0;
    text-align: center;
    color: #555;
    }
    </style>
    </head>

    <body>

    <!-- #content: holds all except site footer - causes footer to stick to
    bottom -->
    <div style="height:100%" >

    <!-- #header: holds the logo and top links -->
    <!-- #header end -->

    <table cellpadding="0" cellspacing="0" border="3" style="height:100%">
    <tr>
    <td style="height:90px">
    <div style=" background-color:White">
    <!-- <div id="headerImg" class="width"></div>
    --> </div>
    </td>
    </tr>
    <tr>
    <td>
    <div style="text-align:left; width: 776px;
    background-color: White; height:100%;border:solid 4px Green">

    <table cellspacing="0" cellpadding="0"
    style="height:100%" >
    <tr>
    <td style="width:150px; text-align:left;margin:0
    0 0 10px" bgcolor="#EDE2E6">
    Advantages<br />
    Concerns<br />
    </td>
    <td>
    This is faqs
    </td>
    </table>

    </div>
    </td>
    </tr>
    <tr bgcolor="#EDE2E6">
    <td style="height:39px" colspan="2">
    </td>
    </tr>
    </table>
    </div>
    </body>

    </html>
    *****************************************

    I can't find an html newsgroup so I was hoping someone here could help.

    Thanks,

    Tom
    tshad, Apr 27, 2010
    #1
    1. Advertising

  2. tshad

    tshad Guest

    I made some changes that seem that now create the top and bottom rows
    correctly, but now the middle, which is 100%, makes the middle row the size
    of the screen not just what is left so that the whole table is the size of
    the screen. Now the table goes below the bottom of the screen. I tried
    taking out one of the 100% from the middle <td> but that just shrunk middle
    down so space was spread between the 3 rows and the table is not 100% of the
    middle section but the size of the content itself.

    ******************************************************


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

    <head><title>
    FAQS
    </title><meta http-equiv="content-type" content="application/xhtml+xml;
    charset=UTF-8" />
    <style type="text/css">
    html,
    body {
    height: 100%;
    }

    body {
    margin: 0;
    padding: 0;
    text-align: center;
    color: #555;
    }
    </style>
    </head>

    <body>

    <!-- #content: holds all except site footer - causes footer to stick to
    bottom -->
    <div style="height:100%;border:solid 4px green" >

    <!-- #header: holds the logo and top links -->
    <!-- #header end -->

    <table cellpadding="0" cellspacing="0" border="3"
    style="width:776px;height:100%">
    <tr>
    <td style="height:100px">
    <div style=" background-color:White">
    <!-- <div id="headerImg" class="width"></div>
    --> </div>
    </td>
    </tr>
    <tr>
    <td style=" height:100%; background-color:Yellow;
    text-align:left">

    <table cellspacing="0" cellpadding="0" style="
    border:solid 4px purple;width:100%;height:100%" >
    <tr>
    <td style="width:150px; text-align:left;margin:0
    0 0 10px" bgcolor="#EDE2E6">
    Advantages<br />
    Concerns<br />
    </td>
    <td>
    This is faqs
    </td>
    </table>

    </td>
    </tr>
    <tr bgcolor="#EDE2E6">
    <td style="height:39px" colspan="2">
    </td>
    </tr>
    </table>
    </div>
    </body>

    </html>
    ******************************************************

    What am I missing?

    Thanks,

    Tom

    "tshad" <> wrote in message
    news:...
    > This now seems to be an html issue, but not sure where to go to check it
    > out.
    >
    > I have been building my asp.net pages where where I want the table to take
    > the whole screen (height 100%) unless it is greater than the size of the
    > screen.
    >
    > I can get it to work fine except for the table spreading the rows.
    >
    > There are 3 rows:
    > Top: holds an image or text about 90px height
    > Middle: has another table with 2 columns - left has menu and right
    > content. Should take up most of the screen and have set at 100%.
    > Bottom: the footer (about 39px).
    >
    > So the top and bottom are fixed with the middle changing as the use
    > changes the size of the screen.
    >
    > But the top and bottom are still about the same size as the middle.
    >
    > I had to strip out all the asp.net code and css files to get to the lowest
    > common denominator.
    >
    > *****************************************
    >
    >
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    >
    > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    >
    > <head><title>
    > FAQS
    > </title><meta http-equiv="content-type" content="application/xhtml+xml;
    > charset=UTF-8" />
    > <style type="text/css">
    > html,
    > body {
    > height: 100%;
    > }
    >
    > body {
    > margin: 0;
    > padding: 0;
    > text-align: center;
    > color: #555;
    > }
    > </style>
    > </head>
    >
    > <body>
    >
    > <!-- #content: holds all except site footer - causes footer to stick to
    > bottom -->
    > <div style="height:100%" >
    >
    > <!-- #header: holds the logo and top links -->
    > <!-- #header end -->
    >
    > <table cellpadding="0" cellspacing="0" border="3" style="height:100%">
    > <tr>
    > <td style="height:90px">
    > <div style=" background-color:White">
    > <!-- <div id="headerImg" class="width"></div>
    > --> </div>
    > </td>
    > </tr>
    > <tr>
    > <td>
    > <div style="text-align:left; width: 776px;
    > background-color: White; height:100%;border:solid 4px Green">
    >
    > <table cellspacing="0" cellpadding="0"
    > style="height:100%" >
    > <tr>
    > <td style="width:150px;
    > text-align:left;margin:0 0 0 10px" bgcolor="#EDE2E6">
    > Advantages<br />
    > Concerns<br />
    > </td>
    > <td>
    > This is faqs
    > </td>
    > </table>
    >
    > </div>
    > </td>
    > </tr>
    > <tr bgcolor="#EDE2E6">
    > <td style="height:39px" colspan="2">
    > </td>
    > </tr>
    > </table>
    > </div>
    > </body>
    >
    > </html>
    > *****************************************
    >
    > I can't find an html newsgroup so I was hoping someone here could help.
    >
    > Thanks,
    >
    > Tom
    >
    >
    tshad, Apr 28, 2010
    #2
    1. Advertising

  3. tshad

    tshad Guest

    BTW, it works perfect in FireFox (ain't that always the case).

    Tom

    "tshad" <> wrote in message
    news:%23a3aA$...
    >I made some changes that seem that now create the top and bottom rows
    >correctly, but now the middle, which is 100%, makes the middle row the size
    >of the screen not just what is left so that the whole table is the size of
    >the screen. Now the table goes below the bottom of the screen. I tried
    >taking out one of the 100% from the middle <td> but that just shrunk middle
    >down so space was spread between the 3 rows and the table is not 100% of
    >the middle section but the size of the content itself.
    >
    > ******************************************************
    >
    >
    > <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    > "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    >
    > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    >
    > <head><title>
    > FAQS
    > </title><meta http-equiv="content-type" content="application/xhtml+xml;
    > charset=UTF-8" />
    > <style type="text/css">
    > html,
    > body {
    > height: 100%;
    > }
    >
    > body {
    > margin: 0;
    > padding: 0;
    > text-align: center;
    > color: #555;
    > }
    > </style>
    > </head>
    >
    > <body>
    >
    > <!-- #content: holds all except site footer - causes footer to stick to
    > bottom -->
    > <div style="height:100%;border:solid 4px green" >
    >
    > <!-- #header: holds the logo and top links -->
    > <!-- #header end -->
    >
    > <table cellpadding="0" cellspacing="0" border="3"
    > style="width:776px;height:100%">
    > <tr>
    > <td style="height:100px">
    > <div style=" background-color:White">
    > <!-- <div id="headerImg" class="width"></div>
    > --> </div>
    > </td>
    > </tr>
    > <tr>
    > <td style=" height:100%; background-color:Yellow;
    > text-align:left">
    >
    > <table cellspacing="0" cellpadding="0" style="
    > border:solid 4px purple;width:100%;height:100%" >
    > <tr>
    > <td style="width:150px;
    > text-align:left;margin:0 0 0 10px" bgcolor="#EDE2E6">
    > Advantages<br />
    > Concerns<br />
    > </td>
    > <td>
    > This is faqs
    > </td>
    > </table>
    >
    > </td>
    > </tr>
    > <tr bgcolor="#EDE2E6">
    > <td style="height:39px" colspan="2">
    > </td>
    > </tr>
    > </table>
    > </div>
    > </body>
    >
    > </html>
    > ******************************************************
    >
    > What am I missing?
    >
    > Thanks,
    >
    > Tom
    >
    > "tshad" <> wrote in message
    > news:...
    >> This now seems to be an html issue, but not sure where to go to check it
    >> out.
    >>
    >> I have been building my asp.net pages where where I want the table to
    >> take the whole screen (height 100%) unless it is greater than the size of
    >> the screen.
    >>
    >> I can get it to work fine except for the table spreading the rows.
    >>
    >> There are 3 rows:
    >> Top: holds an image or text about 90px height
    >> Middle: has another table with 2 columns - left has menu and right
    >> content. Should take up most of the screen and have set at 100%.
    >> Bottom: the footer (about 39px).
    >>
    >> So the top and bottom are fixed with the middle changing as the use
    >> changes the size of the screen.
    >>
    >> But the top and bottom are still about the same size as the middle.
    >>
    >> I had to strip out all the asp.net code and css files to get to the
    >> lowest common denominator.
    >>
    >> *****************************************
    >>
    >>
    >> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    >> "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    >>
    >> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    >>
    >> <head><title>
    >> FAQS
    >> </title><meta http-equiv="content-type" content="application/xhtml+xml;
    >> charset=UTF-8" />
    >> <style type="text/css">
    >> html,
    >> body {
    >> height: 100%;
    >> }
    >>
    >> body {
    >> margin: 0;
    >> padding: 0;
    >> text-align: center;
    >> color: #555;
    >> }
    >> </style>
    >> </head>
    >>
    >> <body>
    >>
    >> <!-- #content: holds all except site footer - causes footer to stick to
    >> bottom -->
    >> <div style="height:100%" >
    >>
    >> <!-- #header: holds the logo and top links -->
    >> <!-- #header end -->
    >>
    >> <table cellpadding="0" cellspacing="0" border="3" style="height:100%">
    >> <tr>
    >> <td style="height:90px">
    >> <div style=" background-color:White">
    >> <!-- <div id="headerImg" class="width"></div>
    >> --> </div>
    >> </td>
    >> </tr>
    >> <tr>
    >> <td>
    >> <div style="text-align:left; width: 776px;
    >> background-color: White; height:100%;border:solid 4px Green">
    >>
    >> <table cellspacing="0" cellpadding="0"
    >> style="height:100%" >
    >> <tr>
    >> <td style="width:150px;
    >> text-align:left;margin:0 0 0 10px" bgcolor="#EDE2E6">
    >> Advantages<br />
    >> Concerns<br />
    >> </td>
    >> <td>
    >> This is faqs
    >> </td>
    >> </table>
    >>
    >> </div>
    >> </td>
    >> </tr>
    >> <tr bgcolor="#EDE2E6">
    >> <td style="height:39px" colspan="2">
    >> </td>
    >> </tr>
    >> </table>
    >> </div>
    >> </body>
    >>
    >> </html>
    >> *****************************************
    >>
    >> I can't find an html newsgroup so I was hoping someone here could help.
    >>
    >> Thanks,
    >>
    >> Tom
    >>
    >>

    >
    >
    tshad, Apr 28, 2010
    #3
    1. Advertising

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

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Raterus
    Replies:
    1
    Views:
    571
    Guest
    Jun 5, 2004
  2. Paul Jacobs
    Replies:
    3
    Views:
    4,565
    Neomorph
    Aug 25, 2003
  3. Tuvas

    Tk not displaying correctly

    Tuvas, Dec 21, 2005, in forum: Python
    Replies:
    2
    Views:
    336
    Tuvas
    Dec 22, 2005
  4. tshad
    Replies:
    0
    Views:
    412
    tshad
    Feb 16, 2007
  5. Jud McCranie
    Replies:
    16
    Views:
    987
    DocuMaker
    Dec 3, 2007
Loading...

Share This Page