Firefox changes table width...

Discussion in 'Javascript' started by McKirahan, Jan 25, 2007.

  1. McKirahan

    McKirahan Guest

    [ I posted this a few days ago in alt.html.css but received
    no response -- it only gets one or two postings a month.
    If there's a more approriate ng then please let me know. ]


    I have a Web page that uses some JavaScript and CSS.

    I have specified a three column table with a fixed-width
    left and right side; the center colum expands to fill the page.

    Within this portion of the table I have another table that
    specifies "display:none" to hide it. When the page loads,
    if JavaScript is enabled then it will change to "display:block".

    However, the problem under Firefox is that the width of
    the inner table column is not 100% as is expected;
    though, the width of the inner table is 100%....

    It fails under FF 1.5 and Opera 9.10;
    it works under IE 5.5 and 6.0.

    Below is the source for a Web page that shows the problem.
    The top table is good; the bottom table shows the problem
    The only difference is: id="divi" style="display:none";
    that is, the code up which the JavaScript acts on.

    Can anyone identify the problem/issue? Thanks in advance.


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    <html>
    <head>
    <title>ff_error.htm</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    window.onload = function() {
    // If JS is enabled then make available items that use it.
    if (document.getElementById("divi")) {
    document.getElementById("divi").style.display = "block";
    }
    }
    </script>
    </head>
    <body>
    <table bgcolor="#EEEEEE" border="0" width="100%">
    <tr valign="top">
    <td bgcolor="#FFFF7D" width="175">&nbsp;</td>
    <th>
    Hello World
    <hr>
    <table bgcolor="#FFFFFF" border="1" width="100%">
    <tr>
    <th bgcolor="#FF08A8" width="100%">Hello World</th>
    </tr>
    </table>
    <hr>
    Hello World
    </th>
    <td bgcolor="#FFFF7D" width="175">&nbsp;</td>
    </tr>
    </table>
    <br><br>
    <table bgcolor="#EEEEEE" border="0" width="100%">
    <tr valign="top">
    <td bgcolor="#FFFF7D" width="175">&nbsp;</td>
    <th>
    Hello World
    <hr>
    <table bgcolor="#FFFFFF" border="1" width="100%" id="divi"
    style="display:none">
    <tr>
    <th bgcolor="#FF08A8" width="100%">Hello World</th>
    </tr>
    </table>
    <hr>
    Hello World
    </th>
    <td bgcolor="#FFFF7D" width="175">&nbsp;</td>
    </tr>
    </table>
    </body>


    W3C says that "This Page Is Valid HTML 4.01 Transitional!".
     
    McKirahan, Jan 25, 2007
    #1
    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. AndrewF
    Replies:
    1
    Views:
    787
    Bruce Barker
    Oct 10, 2005
  2. Sean Jorden
    Replies:
    1
    Views:
    601
    laurie
    Aug 19, 2003
  3. kris
    Replies:
    11
    Views:
    878
  4. David Basford
    Replies:
    3
    Views:
    2,432
    BootNic
    Sep 30, 2007
  5. Replies:
    1
    Views:
    742
    Beauregard T. Shagnasty
    Dec 29, 2007
Loading...

Share This Page