vmtemplatetree (firefox ie有区别！！！)

<!--
 * Created on 2010/05/19
 * Created by 0373jy
 * To change the template for this generated file go to
 * Window - Preferences - PHPeclipse - PHP - Code Templates
 -->
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

        <style type="text/css">
            table.outtable
            {
                border-collapse:collapse;
                border:solid 1px black;
                background-color:#F5F5DC;
                width:100%;
            }
            table.insidetable
            {
                border-collapse:collapse;
                width:100%;
                height:100%;
                table-layout:fixed;
            }
            td
            {
                border:solid 1px black;
            }
            td.leftpart
            {
                width:30%;
                height:700px;
                border-right-style:none;
                text-align:left;
                vertical-align:top;
                background-color:white;
            }
            td.rightpart
            {
                width:70%;
            }
            td.centerpartfirst
            {
                border-style:none;
                width:10%;
            }
            td.centerpartsecond
            {
                border-style:none;
                width:10%;
                text-align:left;
                vertical-align:top
            }
            td.centerpartthird
            {
                width:100%;
                border-style:none;
                text-align:right;
            }
            td.rightpartfirst
            {
                width:90%;
                background-color:white;
            }
            td.rightpartsecond
            {
                width:90%;
                height:500px;
                background-color:white;
                vertical-align:top;
            }
            table.righttablefirstsecond
            {
                margin-top:30px;
                width:100%;
                table-layout:fixed;
                word-wrap:break-word;
            }
            table.righttablethird
            {
                width:98%;
                margin-top:30px;
                margin-bottom:30px;
            }
            .twobutton
            {
                margin-left:15px;
                margin-right:15px;
                height:30px;
                width:130px;
            }
        </style>
        
        <?php
            function setTree(){
                $treetrunk = array("ホスト1","ホスト2","ホスト3","ホスト4","ホスト5","ホスト6");
                
                for ($y=0;$y<count($treetrunk);$y++){
                    echo "<div style=/"padding:5px;padding-left:20px/">";
                    echo "<img id = /"treetrunk".$y."/" src = /"plus.gif/" alt=/"+/" onclick=/"treechange(treetrunk".$y.",'treebranchid".$y."');/" style=/"vertical-align:middle;/">";
                    echo "&nbsp;";
                    echo "<a href=/"javascript:void(0)/" onclick=/"treechange(treetrunk".$y.",'treebranchid".$y."');/" style = /"text-decoration:none;color:black;vertical-align:middle;/">$treetrunk[$y]</a>";
                    echo "</div>";
                    echo "<span id = /"treebranchid".$y."/" style=/"display:none;margin-left:45px;/">";
                    $treebranch = array("branch1","branch2","branch3","branch4","branch5","branch666666666666666666666666666666666666666666666666666666666666666666666666667");
                    for($i=0;$i<count($treebranch);$i++)
                    {
                        echo "<div>";
                        echo "<img src=/"folder.gif/">";
                        echo "<a href=/"javascript:void[$y]/" onclick =/"showinfo(this);/" id=/"$y"."$i/" name=/"$y"."$i"."$y"."$i/" style=/"text-decoration:none;color:black;text-align:center/">&nbsp;&nbsp;$treebranch[$i]</a>";
                        echo "</div>";
                    }
                    echo "</span>";
                }
            }
        ?>
        <script type="text/javascript">
            function treechange(treetrunkimg,treebranchid){
                if (treetrunkimg.alt == "+"){
                    treetrunkimg.alt = "-";
                    treetrunkimg.src = "minus.gif";
                    document.getElementById(treebranchid).style.display = "block";
                    
                }
                else{
                    treetrunkimg.alt = "+";
                    treetrunkimg.src = "plus.gif";
                    document.getElementById(treebranchid).style.display = "none";
                }
            }
            
            function showinfo(branchinfo){
                VMname.innerHTML = branchinfo.id;
                VMinfo.innerHTML = branchinfo.name;
            }
        </script>
    </head>
    
    <body style="height:100%;width:100%">
        <div>
            <table class="outtable">
                <tr><td style="padding:10px;"><div>
                    <table class="insidetable">
                        <tr>
                            <td class="leftpart">
                                <div style="overflow:auto;height:100%;width:100%;white-space:nowrap;"><!--padding-left:30px;padding-right:30px;-->
                                    <?php setTree(); ?>
                                </div>
                            </td>
                            <td class="rightpart">
                                <div>
                                    <table class="righttablefirstsecond">
                                        <tr>
                                            <td class="centerpartfirst">&nbsp;&nbsp;VM名称：</td>
                                            <td class="rightpartfirst" id="VMname">222</td>
                                            <td style="width:5px"></td>
                                        </tr>
                                    </table>
                                </div>
                                <div>
                                    <table class="righttablefirstsecond">
                                        <tr>
                                            <td class="centerpartsecond">&nbsp;&nbsp;説明：</td>
                                            <td class="rightpartsecond" id="VMinfo">1288888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888888883</td>
                                            <td style="width:5px"></td>
                                        </tr>
                                    </table>
                                </div>
                                <div>
                                    <table class="righttablethird">
                                        <tr>
                                            <td class="centerpartthird">
                                                <input type="button" class="twobutton" value ="実行">
                                                <input type="button" class="twobutton" value ="戻る">
                                            </td>
                                            <td style="width:5px"></td>
                                        </tr>
                                    </table>
                                </div>
                            </td>
                        </tr>
                    </table>
                </div></td></tr>
            </table>
        </div>
    </body>
</html>