0

我有一个包含 3 个 div 的 div。左右两边的 div 的宽度都设置为 200px，中间的 div 应该得到所有剩余的宽度。这在 Firefox 中可以正常工作，但在 IE8 和 IE9 中则不行。

有人可以告诉我为什么这在 IE 中不起作用吗？

<html>
<body>
<div id="outercontainer" style="width:100%;overflow:hidden;">
    <div class"fixedtablediv" style="width:200px;float:right;">
        <table id="signtable" class="patable">
        <thead>
            <tr style="height: 101px;" class="headstyle" id="signtableheadtr"> 
            <td style="text-align: left;"><b>Summa</b></td>
            <td style="text-align: left;"><b>Godk.&nbsp;<input name="trigger" tabindex="-1" value="appr" onclick="checkAll(0, this, this.value)" type="checkbox"></b></td>
            <td style="text-align: left;"><b>Spärr&nbsp;<input name="trigger1" tabindex="-1" value="block" onclick="checkAll(0, this, this.value)" type="checkbox"></b></td>
            </tr>
        </thead>
        <tbody>
            <tr class="rowlight">
            <td style="text-align: right;">40.00</td>
            <td style="text-align: left;"><input name="appr" value="0" type="checkbox"></td>
            <td style="text-align: left;"><input name="block" value="0" type="checkbox"></td>
            </tr>
            <tr class="rowdark">
            <td style="text-align: right;">32.00</td>
            <td style="text-align: left;"><input name="appr" value="1" type="checkbox"></td>
            <td style="text-align: left;"><input name="block" value="1" type="checkbox"></td>
            </tr>
        </tbody>
        </table>        
    </div>  
    <div class"fixedtablediv" style="width:200px;float:left;">
        <table id="nametable">
        <thead id="nametablehead" style="vertical-align:bottom;">
            <tr class="headstyle" id='nametableheadtr'>
                <td style="text-align: left;"><a class="" href="/hrm/web?palette=0&amp;value=&amp;funcid=F_PAC_10"><b>Firstname</b></a></td>
                <td style="text-align: left;"><a class="" href="/hrm/web?palette=0&amp;value=&amp;funcid=F_PAC_11"><b>Lastname</b></a></td>
                <td style="text-align: left;"><a class="" href="/hrm/web?palette=0&amp;value=&amp;funcid=F_PAC_12"><b>Id</b></a></td>
            </tr>
        </thead>
        <tbody>     
            <tr class="rowlight" onmouseover="this.style.background = '#EED';" onmouseout="this.style.background = '';"> 
                <td style="text-align: left;">Gunnar</td><td style="text-align: left;">Svensson</td>
                <td style="text-align: left;">123</td>
            </tr>
            <tr class="rowdark" onmouseover="this.style.background = '#EED';" onmouseout="this.style.background = '';"> 
                <td style="text-align: left;">Sven</td>
                <td style="text-align: left;">Svensson</td>
                <td style="text-align: left;">789</td>
            </tr>
        </tbody>
        </table>
    </div>
    <div id="scrolldiv" style="overflow:auto;margin-left:200px;margin-right:200px;">
        <table id="projecttable">
            <thead id="projtablehead">
            <tr class="headstyle">
                <td colspan="47" style="text-align: left;"><b>Projects</b></td>
            </tr>
            <tr class="headstyle">
                <td style="text-align: left;"><b>M123-ABC DBF Proc</b></td>
                <td style="text-align: left;"><b>Meetings and Reviews</b></td>
                <td style="text-align: left;"><b>R9/Offertarbete Max</b></td>
                <td style="text-align: left;"><b>R9/Offertarbete flights</b></td>
                <td style="text-align: left;"><b>R1/ABC12 Planning &amp; Project control</b></td>
                <td style="text-align: left;"><b>RU123/ABC12 Contract Admi</b></td>
                <td style="text-align: left;"><b>RU13/ABC12 Product Assurance</b></td>
                <td style="text-align: left;"><b>RU121/ABC12 LS Planning</b></td>
                <td style="text-align: left;"><b>RU12242/ABC12 LS execution</b></td>
                <td style="text-align: left;"><b>RU11/ABC12 LS Plan and Final REP.</b></td>
                <td style="text-align: left;"><b>RU52/ABC12 LS Pre and post campaign</b></td>
                <td style="text-align: left;"><b>RU61/ABC12 LS Campaign Mngmt</b></td>
                <td style="text-align: left;"><b>RU62/ABC12 LS Campaign execution</b></td>
                <td style="text-align: left;"><b>RU29/ABC12 P/L System engineering</b></td>
                <td style="text-align: left;"><b>R1/Planning&amp;Project control</b></td>
                <td style="text-align: left;"><b>R1/Contract Admi</b></td>
                <td style="text-align: left;"><b>R1/Prod Assurance</b></td>
                <td style="text-align: left;"><b>R1/System engineering</b></td>
                <td style="text-align: left;"><b>R1/B3 mgmt</b></td>
                <td style="text-align: left;"><b>R1/B3 Meetings and Reviews</b></td>
                <td style="text-align: left;"><b>R1/B3 Sys Eng</b></td>
                <td style="text-align: left;"><b>R1/IMP Mgmt</b></td>
                <td style="text-align: left;"><b>R1/IMP Meetings and Reviews</b></td>
                <td style="text-align: left;"><b>R1/IMPACHT Sys Eng</b></td>
                <td style="text-align: left;"><b>R1/CD  mgmt</b></td>
                <td style="text-align: left;"><b>R1/CD  Sys Eng</b></td>
                <td style="text-align: left;"><b>RA8/Management &amp; PA</b></td>
                <td style="text-align: left;"><b>RA8/C Re-entry cone</b></td>
                <td style="text-align: left;"><b>RA9/Management and PA</b></td>
                <td style="text-align: left;"><b>RA95/Ext Meetings and Design Review</b></td>
                <td style="text-align: left;"><b>RA9/System Engineering</b></td>
                <td style="text-align: left;"><b>RA9/New TMSystem dev. t.</b></td>
                <td style="text-align: left;"><b>RA9/Guidance and control system</b></td>
                <td style="text-align: left;"><b>RA95/ABC proc manuf. and design</b></td>
                <td style="text-align: left;"><b>RA95/assembly and test</b></td>
                <td style="text-align: left;"><b>RA9/ Proc manuf. and design</b></td>
                <td style="text-align: left;"><b>RA9/assembly and test</b></td>
                <td style="text-align: left;"><b>RA9/INA integration and test</b></td>
                <td style="text-align: left;"><b>RA9/system integration and test</b></td>
                <td style="text-align: left;"><b>RA9/Fin assembly</b></td>
                <td style="text-align: left;"><b>RA9/motor</b></td>
                <td style="text-align: left;"><b>RA9/transport</b></td>
                <td style="text-align: left;"><b>RA9/review and end to end test</b></td>
                <td style="text-align: left;"><b>RA9/Prep</b></td>
                <td style="text-align: left;"><b>RA9/campaign</b></td>
                <td style="text-align: left;"><b>RA9/Flight Work</b></td>
                <td style="text-align: left;"><b>RA9/8 Study</b></td>
            </tr>
            </thead>
            <tbody>
                <tr class="rowlight" onmouseover="this.style.background = '#EED';" onmouseout="this.style.background = '';"> <td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"><span title="2013-03-04&nbsp;8.00&nbsp;Projekttid&nbsp;2013-03-05&nbsp;4.00&nbsp;Projekttid&nbsp;2013-03-06&nbsp;3.00&nbsp;Projekttid&nbsp;">15.00</span></td><td style="text-align: right;"><span title="2013-03-06&nbsp;5.00&nbsp;Projekttid&nbsp;">5.00</span></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"><span title="2013-03-07&nbsp;8.00&nbsp;Projekttid&nbsp;">8.00</span></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td></tr>
                <tr class="rowdark" onmouseover="this.style.background = '#EED';" onmouseout="this.style.background = '';"> <td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"><span title="2013-03-04&nbsp;8.00&nbsp;Projekttid&nbsp;2013-03-05&nbsp;8.00&nbsp;Projekttid&nbsp;">16.00</span></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"><span title="2013-03-06&nbsp;8.00&nbsp;Projekttid&nbsp;">8.00</span></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td><td style="text-align: right;"></td></tr>
            </tbody>
        </table>
    </div>
</div>
</body>
</html>
4

1 回答 1

-1

看起来你在quirksmode。您应该包括一个 DOCTYPE 声明，即

<!DOCTYPE html>
or
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
于 2013-03-22T17:47:21.197 回答