I was developing a DotNetNuke module for our Code71.com website. I was using ajaxcontroltoolkit’s tabpanel for this module. Everything was working fine in firefox. But when I checked that module in IE, UI of the TabPanel was broken :(.
I searched in for the issue, but could not find related to this problem. After spending a whole day trying to solve the problem (by changing css), I found that it was working fine with the default skin of DotNetNuke but broken with my custom skin! Then I copied all code from default skin to my custom skin, but still it was broken :(. Then I compared rendered HTML for two different skin and found that only difference is in DOCTYPE!
In my custom skin, I did not defined any DOCTYPE, so it was automatically generating -
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
Then I changed the DOCTYPE and the UI was working fine.
To define a DOCTYPE for your skin in DotNetNuke, you have to create a xml file defining the DOCTYPE in your skin directory. This xml file should be named as [SkinName].doctype.xml. For example, if your skin name is MySkin then DOCTYPE file name will be MySkin.doctype.xml. Content of the xml file should be like this -
<SkinDocType>
<![CDATA[<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">]]>
</SkinDocType>
