2009-08-16 2 views
5

У меня проблема с IE7.IE7 не отображает часть страницы, пока окно не изменится или не переключится между вкладками

У меня есть фиксированный макет для хранения заголовка и боковой панели, закрепленной на странице, оставляя только переключатель области основного содержимого, может с удовольствием прокручивать содержимое.

layout on Twitpic http://twitpic.com/show/thumb/e32q7.png

Этот макет отлично работает для IE6 и IE8, но иногда одна страница может начать «скрывается» содержание, которое должно показываться в области «основному содержанию».

Эта страница заканчивает загрузку только штрафа. В течение секунды второй IE7 будет отображать основное содержимое просто отлично, а затем он сразу же скроет его из вида .. где-то .. Казалось бы, он испытывает только эту проблему, когда имеется достаточное количество контента, чтобы заставить область «основного контента» прокрутки.

Изменение размера окна или переход на другую открытую вкладку и обратно приведет к тому, что IE7 отобразит страницу так, как она была предназначена.

Обратите внимание, что аналогичная проблема возникает с IE8 в режиме совместимости, но страница отображается правильно в режиме IE8.

Если необходимо, я могу приложить базовый стиль CSS, который я использую, но сначала хочу узнать, известна ли эта проблема с IE7.

Есть ли у IE7 проблемы с расположением прокрутки и переполнения переполнения, которые иногда любят забывать закончить рендеринг страницы до тех пор, пока какое-то событие перерисовывает окно для завершения рендеринга?

Помните, что этот точный макет используется на нескольких страницах сайта, поскольку он настроен на главной странице. Это просто (в данном случае) одна страница, которая испытывает эту проблему.

Другие страницы с точной компоновкой делают правильно. Даже если основной контент заполнен достаточно, чтобы прокручивать.

ОБНОВЛЕНИЕ: A related question, который не имеет ответа на данный момент.

КОНЦЕ UPDATE: Добавление примера MasterPage и CSS

Пожалуйста, обратите внимание, это тот же формат одинаков для всех страниц в приложении. Моя проблема с IE7 возникает только на одной такой странице. Все остальные страницы успешно отображаются правильно в IE7. Только одна страница, используя ту же самую компоновку, имеет проблемы, где иногда скрывает содержимое в div «work-space».

Мастер страницы

<%@ 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; 
} 

по умолчанию.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> 
+0

Он работает на моей машине ... (используя представление IE8 comp) Возможно, проблема в данных? –

+0

Зачем нужны данные? У меня два экрана построены одинаково. У IE7 только одна проблема. Предоставленные данные разные, но я все еще не могу понять, почему это влияет на вещи. IE7 отображает страницу, если вы изменяете размер окна или просто переключаетесь между вкладками (и не обновляете страницу вообще). Это похоже на то, что IE7 отказывается от рендеринга страницы при первой загрузке, и только в каком-то оконном событии это заставляет думать «oops, я еще не закончил рендеринг этой страницы. Я должен отобразить ее правильно сейчас». Самое разочаровывающее. – BlackMael

+0

Я имею в виду: возможно, данные имеют длинный html или какой-то забавный характер. Почему бы вам не попробовать одну и ту же страницу, но без каких-либо записей в таблице? Кроме того, скриншот того, как выглядит IE7 на вашем компьютере, будет замечательным, чтобы лучше понять проблему. –

ответ

11

Одна теория:

Ваш CSS объявлен после основного содержания (что вызывает то, что называется «вспышка без стилей содержания»), и в вашем CSS есть более ошибка IE7 (может быть peekaboo bug), что заставляет контент скрываться.

Попробуйте добавить:

 
position: relative; 
min-width: 0; 

К содержанию, который исчезает.

+0

За исключением других страниц с тем же самым объявлением таблиц стилей не имеет такой же проблемы. На самом деле страница с проблемой иногда будет выглядеть просто отлично, без изменения размера или переключения вкладок. Хотя после того, как страница имеет проблемы, она, как правило, продолжает возникать проблемы. Не существует жесткого и быстрого правила, которое я могу определить, который может последовательно определять, будет ли страница полностью отображаться правильно. – BlackMael

+0

Есть ли пример (CSS и HTML) где-нибудь? – etoleb

+0

Я добавлю css и html завтра, поскольку у меня сейчас нет кода со мной в этот вечер – BlackMael