0

我有以下 asp.net 页面，顶部有一个固定的标题，宽度为 100%。底层内容居中对齐并在标题下滚动。

当另存为文件并在 Firefox 和 Chrome 中打开时，这非常有效，但在 IE9 中不起作用。在 IE9 中，标题将所有内容都向左对齐？

见JSFiddle

带有 CSS 的整页

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">

    <style>

    #header {
        margin: 0;
        padding-top: 5px;
        height: 25px;
        width: 100%;
        background-color: orange; /*#E1E1E0;*/
        position: fixed;
        z-index: 1000;
    }

    .header_link {
        float: right;
        margin-top: 3px;
        margin-right: 15px;
        cursor: pointer;
        color: #284E98 !important;
        font-size: small;
    }


    .content {
        width: 900px;
        margin: 0 auto;
        padding-top: 10px;
        padding-bottom: 10px;
        background-color: red; /* added to show problem */
    }   

    </style>



    <div id="header">
        <a href="./About.aspx" class="header_link" onclick="return hs.htmlExpand(this, { objectType: 'ajax' })">About</a>       
        <a href="./Default.aspx" class="header_link">Home</a>
    </div>

    <div class="content">
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>
        <p>foo</p>  
    </div>

    </form>
</body>
</html>
4

1 回答 1

4

您需要<!DOCTYPE>在所有 HTML 页面的顶部有一个。

没有它，IE 将进入 Quirks 模式，这将导致各种 CSS 错误。

将有效的文档类型添加到您的页面。如果您不确定要使用哪种 doctype，最好使用 HTML5 doctype：

<!DOCTYPE html>

就那么简单。

希望有帮助。

于 2013-05-24T10:32:08.377 回答