Problem
I have created a custom skin in for DNN that has several div tags centered on the page using the following CSS:
margin: 20px auto 20px auto;
This works great in Firefox, but not in Internet Explorer 7 the same div tags are left aligned.
Firefox
Internet Explorer 7
Solution
I stumbled upon this CSS thread that lead me to believe that this had to do with the default DOCTYPE that DNN uses. I did not see an obvious way to change the DOCTYPE via the admin console. A quick search on Google brought me to this solution posted by John Mitchell.
The issue has to do with the default DOCTYPE that DNN uses. In my case it was:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
The fix that John describes has you add the following code to the skin.ascx file that was created when you imported your custom DotNetNuke skin:
<script runat="server">
Private Sub Page_Load(ByVal sender As System.Object, ByVal e As System.EventArgs) Handles MyBase.Load
Dim skinDocType as Control = Me.Page.FindControl("skinDocType")
If Not skinDocType is Nothing
CType(skinDocType, System.Web.UI.WebControls.Literal).Text="<!DOCTYPE html PUBLIC ""-//W3C//DTD XHTML 1.0 Strict//EN"" ""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"">"
End If
End Sub
</script>
The above code worked swimmingly for me. Now my site's content is centered in both Firefox and Internet Explorer.