I have a page creating code for an iframe via javascript.
I was using tables to line up my questions and answers and two buttons in an inner table. When I try and add doctype it screws up in ie9.
Code:
<html>
<head>
<script>
 var openbody='\<html lang="en"\>\n\<head\>\n\<meta charset="utf-8"\>\</meta\>\n\</head\>\n\<body\>\n';
 var closebody='\</body\>\n\</html\>';
function make_html(tag,data,extra,newline){return_value="\<"+tag;if(extra!=""){return_value+=" "+extra;}return_value+="\>"+newline+data+"\</"+tag+"\>";return return_value;}
function make_row(data,extra){return make_html("tr",make_html("td",data,extra,""),"","");}
function dosomething(input)
{
  var mycontentDocument=document.getElementById('mycontent').contentDocument;
  if(!mycontentDocument){mycontentDocument=document.frames['mycontent'].document;}
  var table=make_row("hello","")+"\n";
  table+=make_row("world","")+"\n";
  var innertable="\<tr\>\<td align='left'\>left\</td\>\<td align='right'\>right\</td\>\</tr\>\n";
  table+=make_row("\n"+make_html("table",innertable,"border=\"0\"","\n")+"\n","")+"\n";
  var output=input;
  output+=openbody;
  output+="hello world\n";
  output+=make_html("table",table,"border=\"0\"","\n")+"\n";
  output+=closebody;
  alert(output);
  mycontentDocument.body.innerHTML=output;
}
</script>
</head>
<body>
<iframe id='mycontent' ></iframe><br>
<input type="button" value="nonproper" onclick="dosomething('')">
<input type="button" value="proper attempt" onclick="dosomething('<!DOCTYPE html>\n')">
</body>
</html>
In IE9 when I press the nonproper button it works fine. When I press the proper attempt button it displays just "hello world" it works in compatibility mode. But I'd like to learn proper use of tables so that even IE9 is happy outside of compatibility mode.