2

我有以下代码：

   <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Main.aspx.cs" Inherits="Main" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link rel="stylesheet" type="text/css" href="Styles/TomsStyleSheet.css" />
</head>
<body>
    <form id="form1" runat="server">
    <div class="centerBlock">
        <asp:GridView ID="GridView1" runat="server" CcsClass="center">
        </asp:GridView>
    </div>
    <br />
    <div class="centerBlock">
        <asp:Label ID="Label1" runat="server" Text="Enter Directory Path: "></asp:Label>
        <asp:TextBox ID="TextBox" Width="200px" runat="server"></asp:TextBox>
        <br />
        <br />
        <asp:Button ID="checksumBtn" runat="server" Text="Calculate Checksum" OnClick="CalculateChecksum" />
        <br />
        <asp:Label ID="errorMsg" runat="server" Text="" CssClass="error"></asp:Label>
    </div>
    </form>
</body>
</html>

这是CSS：

.centerBlock
{
    margin-left:auto;
    margin-right:auto;
    width:50%;
}

我想要做的只是将它居中......现在水平但垂直也很好，所以它在页面中间轻拍。

我知道引用外部样式表不是问题，因为最后一行的 CssClass="error" 可以正常工作。我也<div style="margin-left:auto;margin-right:auto;">按照这个建议尝试过，但似乎没有任何效果。输出当前是左对齐的，而不是居中的。我正在使用 IE 7。

4

3 回答 3

4

如果您希望它恰好位于页面中间，请尝试以下操作：

.centerBlock {
    position: fixed;
    top: 50%;
    left: 50%;
    width: 50%;
    height: 200px;
    margin: -100px 0 0 -25%;
}

请参阅此jsFiddle 演示。

您显然需要相应地调整高度和上边距。

于 2013-02-11T15:29:11.963 回答
1

自动边距仅在 Internet Explorer 处于标准模式时才有效。在 quirks 模式下，它将模拟 IE 5 并且不支持它们。

添加将触发标准模式的 Doctype。例如

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
   "http://www.w3.org/TR/html4/strict.dtd">

或者

<!DOCTYPE html>

另见维基百科：怪癖模式

于 2013-02-11T15:36:39.237 回答
0

事实证明，简单地刷新浏览器似乎解决了我的问题。我注意到，当我更新我的 CSS 时，它没有确认 Web 浏览器中更改的值 - 当我在 Chrome 中执行右键单击 > 检查元素时，它仍然显示旧值，即使在停止调试、停止服务器之后，或退出并重新打开 Visual Studio。

我进行了搜索，发现了这篇有用的帖子，它让我知道问题出在浏览器上。

于 2013-02-11T16:52:31.627 回答