私は主にDOMスクリプトによって作成されたページを持っています。このスクリプトは、いくつかのWebカメラから画像のテーブル（通常のimg要素）を生成します（ペットの搭乗をしている友人を助け、私のHTML / DOMは少し錆びています）。
FF3またはChromeでは正常に機能しますが、IE7では機能しません。実際、テーブル全体はIEでは表示されません（ただし、本体の背景色が適用されます）。
IEのページを見ると、スクリプトエラーはなく、CSSは正常に適用されているように見え、DOMには、すべて生成されたテーブル内のすべてのセルと行が表示されているように見えます。
IE Developerツールバーを使用して、画像レポートを実行すると、画像も表示されます（画像がテーブルに表示されず、ページにレンダリングされたテーブルの証拠がない場合でも、セル内のテキストもレンダリングされません）
img要素を見て、トレーススタイル機能を使用すると、一度にimg要素がすべて表示されていることがわかりました：none、インラインスタイルと表示されていますが、これを行うコードやスタイルシートには何もありません。スタイルシートのすべてのテーブル要素に明示的なエントリを追加し始めたので、この問題は解消されたようです。
どこから始めれば？
body { background-color : gray ; color : white ; margin : 0 ; font-family : Verdana, "lucida console", arial, sans-serif ; }
#CameraPreviewParent { text-align : center ; width : 100% ; }
#CameraTable { text-align : center ; width : 100% ; }
#CameraLiveParent { text-align : center ; margin : 50px ; }
#CameraLiveHeading { color : white ; }
td.CameraCell { text-align : center ; }
img.CameraImage { border : none ; }
a:link, a:visited, a:active, a:hover { text-decoration : none ; color : inherit ; }
table#CameraTable { color : white ; background-color : gray ; }
td.CameraCell { color : white ; background-color : gray ; }
スタイルシートを完全に削除しても効果はありません。
生成後のページのコードは次のとおりです（DOMツールバーからのフォーマットについてお詫びします-読みやすくするためにいくつかの改行を入れようとしました）：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML Strict//EN"><META http-equiv="Content-Type" content="text/html; charset=windows-1252">
<HTML>
<HEAD>
<TITLE></TITLE>
<SCRIPT src="cameras.js" type="text/javascript"> </SCRIPT>
<SCRIPT type="text/javascript">
function CallOnLoad() {
document.title = PreviewPageTitle ; BuildPreview(document.getElementById("CameraPreviewParent")) ;
}
</SCRIPT>
</HEAD>
<BODY>
<!-- Any HTML can go here to modify page content/layout -->
<DIV id="CameraPreviewParent">
<TABLE id="CameraTable" class="CameraTable">
<TR id="CameraRow0" class="CameraRow">
<TD id="CameraCell0" class="CameraCell"><A id="CameraNameLink0" href="http://192.168.4.3:801" class="CameraNameLink">Luxury Suite 1 (1)</A><BR /><A id="CameraLink0" href="camlive.html?camIndex=0" class="CameraLink"><IMG id="CameraImage0" title="Click For Live Video from Luxury Suite 1 (1)" height="0" alt="Click For Live Video from Luxury Suite 1 (1)" src="http://192.168.4.3:801/IMAGE.JPG" width="0" class="CameraImage" /></A></TD>
<TD id="CameraCell1" class="CameraCell"><A id="CameraNameLink1" href="http://192.168.4.3:802" class="CameraNameLink">Luxury Suite 2 (2)</A><BR /><A id="CameraLink1" href="camlive.html?camIndex=1" class="CameraLink"><IMG id="CameraImage1" title="Click For Live Video from Luxury Suite 2 (2)" height="0" alt="Click For Live Video from Luxury Suite 2 (2)" src="http://192.168.4.3:802/IMAGE.JPG" width="0" class="CameraImage" /></A></TD>
</TR>
</TABLE>
</DIV><!-- This element is used to hold the preview -->
<!-- Any HTML can go here to modify page content/layout -->
</BODY>
</HTML>
どうやら、画像の幅と高さで挿入するDOMコードは、IEでは正しく機能していません。
var PhotoWidth = 320 ;
var PhotoHeight = 240 ;
var image = document.createElement("img") ;
image.setAttribute("id", "CameraImage" + camIndex) ;
image.setAttribute("class", "CameraImage") ;
image.setAttribute("src", thisCam.ImageURL()) ;
image.setAttribute("width", PhotoWidth) ;
image.setAttribute("height", PhotoHeight) ;
image.setAttribute("alt", thisCam.PreviewAction()) ;
image.setAttribute("title", thisCam.PreviewAction()) ;
link.appendChild(image) ;
テーブルを動的に構築するときのrequireTBODY要素に関する応答は、問題全体のように見えます。これは、DOMで画像の幅と高さを0に設定することさえあるようです。