Link to home
Start Free TrialLog in
Avatar of KNVB HK
KNVB HKFlag for Hong Kong

asked on

Overcome firefox does not support height=100 % question

When you execute the following code,
It work fine, however, it is because I need to make the layer resizable,
it is impossible for hard code the "height" value.
However,when I change the "height" attribute value to "100%",and click the button several times, the table size will be extend in firefox. In IE it does not extend the table size even I add a lot text in the layer.
Can you any one tell me how to fix the problem?
I am using YUI framework to make it resizable.
I am trying to capture the endresize event, however, there are no sample code, I don't know how to do so.
<html>
<body>
	<input type=button onclick="doIt()" value="add item">
	<div style="height:275">
	<table border=1 style="height:100%">
		<tr height="5%"> 
			<td>
				<select>
					<option>1</option>
					<option>2</option>
				</select>
			</td>
		</tr>
		<tr>
			<td>
				<div id="msg" style="width:100%;height:95;border:1px solid rgb(179, 179, 179);overflow:auto">
					d<br>a<br>t<br>a<br>
					d<br>a<br>t<br>a<br>
				</div>
			</td>
		</tr>
	</table>
	</div>
	<script language=javascript>
		function doIt()
		{
			var msg=document.getElementById("msg");
			msg.innerHTML+="fsdfs<br>";
		}
	</script>
</body>

Open in new window

Avatar of Kin Fat SZE
Kin Fat SZE
Flag of Hong Kong image

like this?
<html>
<body>
        <input type=button onclick="doIt()" value="add item">
        <div style="height:275">
        <table border=1 style="height:100%">
                <tr height="5%"> 
                  <td>
                    <select>
                            <option>1</option>
                            <option>2</option>
                    </select>
                  </td>
                </tr>
                <tr>
                    <td>
                      <div id="msg" style="width:100%;height:100%;border:1px solid rgb(179, 179, 179);overflow:visible">
                              d<br>a<br>t<br>a<br>
                              d<br>a<br>t<br>a<br>
                      </div>
                    </td>
                </tr>
        </table>
        </div>
        <script language=javascript>
                function doIt()
                {
                        var msg=document.getElementById("msg");
                        msg.innerHTML+="fsdfs<br>";
                        msg.style.height='100%';
                        
                }
        </script>
</body>

Open in new window

ASKER CERTIFIED SOLUTION
Avatar of KNVB HK
KNVB HK
Flag of Hong Kong image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial