中間div應該保持剩余寬度。 在Firefox中有效，但在IE中無效。 為什么？
[英]Middle div should get remaining width. Works in Firefox but not IE. Why?
問題描述
我有一個包含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. <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 <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&value=&funcid=F_PAC_10"><b>Firstname</b></a></td>
<td style="text-align: left;"><a class="" href="/hrm/web?palette=0&value=&funcid=F_PAC_11"><b>Lastname</b></a></td>
<td style="text-align: left;"><a class="" href="/hrm/web?palette=0&value=&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 & 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&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 & 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 8.00 Projekttid 2013-03-05 4.00 Projekttid 2013-03-06 3.00 Projekttid ">15.00</span></td><td style="text-align: right;"><span title="2013-03-06 5.00 Projekttid ">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 8.00 Projekttid ">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 8.00 Projekttid 2013-03-05 8.00 Projekttid ">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 8.00 Projekttid ">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>
1 個解決方案
解決方案1
-1 已采納 2013-03-22 17:47:21
看來您處於怪癖模式 。 您應該包括一個DOCTYPE聲明，即
<!DOCTYPE html>
or
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
在沒有寬度的浮動div中浮動子項時Chrome和Firefox的不同渲染。
[英]Different rendering from Chrome and Firefox when having floated children in a floated div with no width.
設置“ location.hash”不適用於IE中的部分頁面回發。 它在FireFox中工作
[英]Setting the “location.hash” cannot work with the partial page postback in IE. It works in FireFox
找不到ID為的元素：僅在IE上執行時才發出。 適用於Firefox
[英]Unable to find element with id : Issue only when executing on IE. Works fine for Firefox
ajax類型：“ GET”適用於Firefox和chrome，但不適用於IE
[英]ajax type:“GET” works for firefox and chrome but not for IE
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.
相關問題
CSS DIV默認寬度在IE中看起來不錯。 不是Firefox
CSS沒有在Firefox或IE中加載。 適用於Chrome
在沒有寬度的浮動div中浮動子項時Chrome和Firefox的不同渲染。
為什么這個按鈕在IE中工作但在Firefox中不起作用？
在Firefox中而不是IE上運行的Javascript，為什么？
設置“ location.hash”不適用於IE中的部分頁面回發。 它在FireFox中工作
找不到ID為的元素：僅在IE上執行時才發出。 適用於Firefox
Div 100％的高度適用於Firefox，但不適用於IE
ajax類型：“ GET”適用於Firefox和chrome，但不適用於IE
IE的高度/寬度與Firefox不同
相關標簽