manipulating html code with javascript

Question

2.00/5 (1 vote)

See more:

Hello -
I have one javascript issue and I hope someone can help me. I need to add javascript code to the code below so that the table table1 (red table) takes whole area of the cell cell1. Also Table table1 should resize itself to take all space of cell1 when we resize browser window.
Here is the html code:

XML

<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
      <title></title>
        <style type="text/css">
        html, body {
        height: 100%;
        margin: 0;
        padding: 0;
        }
        </style>
  </head>
  <body>
  <table height=100% width=100% border=1 cellpadding=0 cellspacing=0>
    <tr><td colspan=2 height=40px></td></tr>
    <tr><td width=75% id="cell1">
        <table style="height:auto" width=100% bgcolor=red id="table1"><tr><td></td></tr></table>
        </td>
        <td></td>
     </tr>
  </table>
  </body>
</html>

Thanks in advance

Posted 20-Dec-11 10:16am

laziale

Add a Solution

Comments

Anele Ngqandu 20-Dec-11 16:23pm

Hi, do you like realy need to use java script??

laziale 20-Dec-11 16:27pm

yes

Sergey Alexandrovich Kryukov 20-Dec-11 18:22pm

Is there another method not using server-side programming?
As this is just the change of view, JavaScript is quite adequate.
--SA

Sergey Alexandrovich Kryukov 20-Dec-11 18:27pm

Even though manipulations like that are pretty easy, the behavior does not seem to make sense. If cell1 is a part of table, what does it mean: "table1 (red table) takes whole area of the cell cell1"? It is already bigger than the cell. If this is just awkward formulation, use "Improve question" above.
--SA

Sunasara Imdadhusen 21-Dec-11 2:35am

You need to re-size Horizontally or Vertically 100%?

1 solution

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

SujayC · Answer 1 · 2012-01-03T21:55:00

Instead of putting style="height:auto" can we try having height attribute for Table table1 to 100%.

XML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<style type="text/css">
html, body {
height: 100%;
margin: 0;
padding: 0;
}
</style>
</head>
<body>
<table height=100% width=100% border=1 cellpadding=0 cellspacing=0>
<tr><td colspan=2 height=40px></td></tr>
<tr><td width=75% id="cell1">
<table height=100% width=100% bgcolor=red id="table1"><tr><td></td></tr></table>
</td>
<td></td>
</tr>
</table>
</body>
</html>

Hope this helps !!