0

Safari でいくつか問題が発生しています。

  1. すべてのブラウザでページが正常に表示されますが、Safari では、下の画像に示すように、メインの ContentPlaceholder の上に巨大な白い領域が追加されます。これはすべてのページで発生するため、問題はマスターページにあると思いますが、修正方法がわかりません。

  2. メニューの上に余分なパディングがあるという小さな問題もあります (Chrome でも同じことが起こります)。

助けていただければ幸いです。前もって感謝します。

すべてのブラウザ

サファリ

ここに私のマスターページがあります:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head runat="server">
<title></title>
<link href="~/Styles/Site.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<div class="page">
    <div class="header">
        <div class="title">
            <h1>
                My ASP.NET Application
            </h1>
        </div>
        <div class="loginDisplay">
            <asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="false">
                <AnonymousTemplate>
                    ................
                </AnonymousTemplate>

                <LoggedInTemplate>
                    ................
                </LoggedInTemplate>
            </asp:LoginView>
        </div>
        <div class="clear hideSkiplink">
            <asp:Menu ID="NavigationMenu" runat="server" CssClass="menu" EnableViewState="false" IncludeStyleBlock="false" Orientation="Horizontal">
                <Items>
                    ................
                </Items>
            </asp:Menu>
        </div>
    </div>
    <div class="leftMenu">
        <asp:ContentPlaceHolder ID="LeftMenuContent" runat="server"/>
    </div>
    <div class="main">
        <asp:ContentPlaceHolder ID="MainContent" runat="server"/>
    </div>

    <div class="clear">
    </div>
</div>
<div class="footer">

</div>
</form>

ソースコードと CSS は次のとおりです: http://jsfiddle.net/V5aCa/6/

4

2 に答える 2

1

これは、display:table サファリを使用しているため、これは他のブラウザとは異なる方法で処理されるためです。

この質問を見てください:

Safari5.1はCSSテーブルのセル間隔を壊します

または使用してみてくださいborder-box

CSSの幅にはパディングが含まれていますか?

ナビゲーションアンカーをスキップするため、ナビゲーションの上のスペースが表示されます。これを絶対に配置するか、フロートさせると、スペースが消えます。

于 2013-02-04T11:29:54.987 に答える
0

ブラウザのマージンとパディングをリセットしてみてください。

body {
      margin: 0px;
     padding: 0px;
}

これにより、サファリはデフォルトに基づいて構築されるのではなく、設定された値から開始するように強制されます。

于 2013-02-04T11:29:15.673 に答える