5

IE7に問題があります。

ヘッダーとサイドパネルをページに固定するための固定レイアウトがあり、「メインコンテンツ」エリアスイッチのみを残してコンテンツをスクロールできます。

Twitpic のレイアウト http://twitpic.com/show/thumb/e32q7.png

このレイアウトは IE6 と IE8 では問題なく機能しますが、「メイン コンテンツ」領域に表示されるはずのコンテンツが 1 つのページで「隠れて」しまうことがあります。

ページの読み込みは問題なく終了します。一瞬、IE7 はメイン コンテンツを正常にレンダリングし、すぐにそれを非表示にします..どこか..また、「メイン コンテンツ」領域を強制的に表示するのに十分なコンテンツがある場合にのみ、この問題が発生するようです。スクロール。

ウィンドウのサイズを変更するか、開いている別のタブに切り替えて元に戻すと、IE7 は意図したとおりにページを表示します。

互換モードの IE8 でも同じ問題が発生しますが、ページは IE8 モードで正しくレンダリングされます。

必要に応じて、私が使用する基本的な CSS スタイルを添付できますが、まず、これが IE7 の既知の問題であるかどうかを確認したいと思います。

IE7 には、ウィンドウの再描画イベントが強制的にレンダリングを終了するまで、ページのレンダリングを正しく終了するのを忘れる場合がある、配置されたレイアウトとオーバーフロー スクロールに関する問題がありますか?

マスター ページで設定されているため、このまったく同じレイアウトがサイト内の複数のページで使用されることに注意してください。この問題が発生しているのは (この場合) 1 つのページだけです。

まったく同じレイアウトの他のページは正しくレンダリングされます。メインコンテンツがスクロールできるほどいっぱいであっても。

更新:この時点で回答がない関連する質問。

LATE UPDATE : マスターページと css の例を追加

この同じレイアウトは、アプリケーション内のすべてのページで同じであることに注意してください。IE7 に関する私の問題は、そのようなページの 1 つだけで発生します。他のすべてのページは、IE7 で問題なく正しくレンダリングされています。まったく同じレイアウトを使用している 1 つのページだけで、「ワークスペース」div のコンテンツが非表示になることがあるという問題があります。

マスターページ

<%@ Master Language="VB" CodeFile="MasterPage.master.vb" Inherits="shared_templates_MasterPage" %>
<!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="~/common/yui/2.7.0/build/reset-fonts/reset-fonts.css" runat="server" />
  <link rel="Stylesheet" type="text/css" href="~/shared/css/layout.css" runat="server" />
  <asp:ContentPlaceHolder ID="head" runat="server" />
</head>
<body>
  <form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server" />
  <div id="app-header">
  </div>
  <div id="side-panel">
  </div>
  <div id="work-space">
    <asp:ContentPlaceHolder ID="WorkSpaceContentPlaceHolder" runat="server" />
  </div>
  <div id="status-bar">
    <asp:ContentPlaceHolder ID="StatusBarContentPlaceHolder" runat="server" />
  </div>
  </form>
</body>
</html>

layout.css

html {
    overflow: hidden;
}

body {
    overflow: hidden;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    background-color: white;
}

body, table, td, th, select, textarea, input {
  font-family: Tahoma, Arial, Sans-Serif;
  font-size: 9pt;
}

p {
  padding-left: 1em;
  margin-bottom: 1em;
}

#app-header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 80px;
  background-color: #dcdcdc;
  border-bottom: solid 4px #000;
}

#side-panel {
  position: absolute;
  top: 84px;
  left: 0px;
  bottom: 0px;
  overflow: auto;
  padding: 0;
  margin: 0;
  width: 227px;
  background-color: #AABCCA;
  border-right: solid 1px black;
  background-repeat: repeat-x;
  padding-top: 5px;
}

#work-space {
    position: absolute;
    top: 84px;
    left: 232px;
    right: 0px;
    padding: 0;
    margin: 0;
    bottom: 22px;
    overflow: auto;
    background-color: White;
}

#status-bar {
  position: absolute;
  height: 20px;
  left: 228px;
  right: 0px;
  padding: 0;
  margin: 0;
  bottom: 0px;
  border-top: solid 1px #c0c0c0;
  background-color: #f0f0f0;
}

Default.aspx

<%@ Page Title="Test" Language="VB" MasterPageFile="~/shared/templates/MasterPage.master" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<asp:Content ID="WorkspaceContent" ContentPlaceHolderID="WorkSpaceContentPlaceHolder" Runat="Server">
  Workspace
  <asp:ListView ID="DemoListView" runat="server"
                DataSourceID="DemoObjectDataSource"
                ItemPlaceholderID="DemoPlaceHolder">
    <LayoutTemplate>
      <table style="border: 1px solid #a0a0a0; width: 600px">
        <colgroup>
          <col width="80" />
          <col />
          <col width="80" />
          <col width="120" />
        </colgroup>
        <tbody>
          <asp:PlaceHolder ID="DemoPlaceHolder" runat="server" />
        </tbody>
      </table>
    </LayoutTemplate>
    <ItemTemplate>
      <tr>
        <th><%#Eval("ID")%></th>
        <td><%#Eval("Name")%></td>
        <td><%#Eval("Size")%></td>
        <td><%#Eval("CreatedOn", "{0:yyyy-MM-dd HH:mm:ss}")%></td>
      </tr>
    </ItemTemplate>
  </asp:ListView>

  <asp:ObjectDataSource ID="DemoObjectDataSource" runat="server" OldValuesParameterFormatString="original_{0}" SelectMethod="GetData" TypeName="DemoLogic">
    <SelectParameters>
      <asp:Parameter Name="path" Type="String" />
    </SelectParameters>
  </asp:ObjectDataSource>
</asp:Content>

<asp:Content ID="StatusContent" ContentPlaceHolderID="StatusBarContentPlaceHolder" Runat="Server">
  Ready OK.
</asp:Content>
4

1 に答える 1

11

一説：

CSS はメイン コンテンツ領域の後に宣言されており (これにより、「スタイル設定されていないコンテンツのフラッシュ」と呼ばれるものが発生します)、CSS には、コンテンツが非表示になる原因となるIE7 バグ (ピーカブー バグの可能性があります) があります。

追加してみてください：

位置: 相対;
最小幅: 0;

消えゆくコンテンツへ。

于 2009-08-16T04:34:56.493 に答える