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;">に従って試しましたが、何も機能していないようです。現在、出力は中央揃えではなく左揃えになっています。IE7を使用しています。

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

自動マージンは、InternetExplorerが標準モードの場合にのみ機能します。クァークズモードでは、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で右クリック> [要素の検査]を実行すると、デバッグを停止してサーバーを停止した後でも、古い値が表示されたままになります。または、VisualStudioを終了して再度開きます。

検索を行ったところ、この役立つ投稿に出くわしました。この投稿は、問題がブラウザにあることを知らせてくれました。

于 2013-02-11T16:52:31.627 に答える