Mam element, który może zawierać bardzo duże ilości danych, ale nie chcę, aby to zepsuło układ strony, więc ustawiłem max-height: 100px i overflow:auto, mając nadzieję, że paski przewijania pojawią się, gdy treść nie pasuje.Przepełnienie IE8: auto z maksymalną wysokością

Wszystko działa poprawnie w przeglądarkach Firefox i IE7, ale IE8 zachowuje się tak, jakby overflow:hidden był obecny zamiast.

Próbowałem overflow:scroll, nadal nie pomaga, IE8 po prostu obcina zawartość bez pokazywania pasków przewijania. Zmiana deklaracji max-height na height powoduje, że przepełnienie działa poprawnie, jest to połączenie max-height i overflow:auto, które niszczy elementy.

to również rejestrowane jako official bug in the final, release version of IE8

Czy istnieje obejście tego problemu? Na razie uciekłem się do używania height zamiast max-height, ale pozostawia mnóstwo pustego miejsca na wypadek, gdyby nie było za dużo danych.

Źródło

2008-08-11 Rytis

Uwaga: to wydaje się być poprawione w IE9 (przynajmniej w RC) –

Po prostu notka dla ppl, która znajdzie to później, widziałem ustawienie max-height i przepełnienie na div w IE8 rozbić całą stronę - jak na stronie pozostaje całkowicie pusty, ale wyświetlany jest tytuł strony. Zabawna zabawa ... – James

Tak, ustawienie maksymalnej wysokości i przepełnienia spowodowało, że strona nie będzie renderowana (całkowicie pusta). Przestawiłem się na przelew, ponieważ to działało na moje potrzeby. –

To jest naprawdę paskudny błąd, gdyż wpływa na nas mocno na przepełnienie stosu z <pre> bloków kodu, które mają max-height:600 i width:auto.

Jest rejestrowany jako błąd w ostatecznej wersji IE8 bez poprawki.

http://connect.microsoft.com/IE/feedback/ViewFeedback.aspx?FeedbackID=408759

Jest naprawdę hacky CSS obejście:

http://my.opera.com/dbloom/blog/2009/03/11/css-hack-for-ie8-standards-mode

/* 
SUPER nasty IE8 hack to deal with this bug 
*/ 
pre 
{ 
    max-height: none\9 
}

i CSS oczywiście warunkowy jak wspominają inni, ale ja nie lubię, bo to oznacza, że” re serwowanie dodatkowych HTML cruft w każdym żądaniu strony.

Źródło

2009-05-19 08:34:12

+1 ale chciałbym móc to zrobić +10 ... –

Otrzymuję 404 na łączu Microsoft. –

To nie działa w IE8! – kheya

Widziałem to zalogowane jako naprawiony błąd w RC1. Ale znalazłem odmianę, która wydaje się powodować trudny błąd renderowania. Obejmuje te dwa style w tabeli zagnieżdżonej.

<!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" lang="en"> 
<head> 
    <title>Test</title> 
    <style type="text/css"> 
    .calendarBody 
    { 
     overflow: scroll; 
     max-height: 500px; 
    } 
    </style> 
</head> 
<body> 
    <table> 
    <tbody> 
     <tr> 
     <td> 
      This is a cell in the outer table. 
     <div class="calendarBody"> 
      <table> 
       <tbody> 
       <tr> 
        <td> 
        This is a cell in the inner table. 
       </td> 
        </tr> 
      </tbody> 
       </table> 
     </div> 
     </td> 
    </tr> 
    </tbody> 
</table> 
</body> 
</html>

Źródło

2009-03-20 22:15:05

Aby odtworzyć:

(to wywala całą stronę).

<HTML> 
<HEAD> 
    <META content="IE=8" http-equiv="X-UA-Compatible"/> 
</HEAD> 

<BODY> 
    look: 

    <TABLE width="100%"> 
     <TR> 
      <TD> 
       <TABLE width="100%"> 
        <TR> 
         <TD> 
          <DIV style="overflow-y: scroll; max-height: 100px;"> 
           X 
          </DIV> 
         </TD> 
        </TR> 
       </TABLE> 
      </TD> 
     </TR> 
    </TABLE> 
</BODY> 
</HTML>

(niniejsza działa dobrze ...)

<HTML> 
<HEAD> 
    <META content="IE=8" http-equiv="X-UA-Compatible"/> 
</HEAD> 

<BODY> 
    look: 

    <TABLE width="100%"> 
     <TR> 
      <TD> 
       <TABLE width="100%"> 
        <TR> 
         <TD> 
          <DIV style="overflow-y: scroll; max-height: 100px;"> 
           The quick brown fox 
          </DIV> 
         </TD> 
        </TR> 
       </TABLE> 
      </TD> 
     </TR> 
    </TABLE> 
</BODY> 
</HTML>

(i szaleńczo, więc robi to [Bez zawartości w div.])

<HTML> 
<HEAD> 
    <META content="IE=8" http-equiv="X-UA-Compatible"/> 
</HEAD> 

<BODY> 
    look: 

    <TABLE width="100%"> 
     <TR> 
      <TD> 
       <TABLE width="100%"> 
        <TR> 
         <TD> 
          <DIV style="overflow-y: scroll; max-height: 100px;"> 
          </DIV> 
         </TD> 
        </TR> 
       </TABLE> 
      </TD> 
     </TR> 
    </TABLE> 
</BODY> 
</HTML>

Źródło

2010-10-05 10:27:17 ANeves

{ 
overflow:auto 
}

Spróbuj div overflow: auto

Źródło

2011-02-11 13:26:05 Egglabs

{max-height:200px, Overflow:auto}

Dzięki Srinivas Tamada, Powyższy kod nie działa dla mnie.

Źródło

2011-05-03 10:00:08 ashipj

Podobna sytuacja, element pre z maxHeight ustawiony przez js, aby zmieścić się w przydzielonej przestrzeni, szerokość 100%, przepełnienie auto.Jeśli zawartość jest krótsza niż maxHeight, a także pasuje poziomo, jesteśmy dobrzy. Jeśli zmienisz rozmiar okna, aby zawartość nie pasowała już poziomo, pojawi się poziomy pasek przewijania, ale wysokość elementu natychmiast przeskakuje do pełnego maksimum, niezależnie od wysokości zawartości.

Próbowałem różnych form hack css wymienionych przez Jeffa, ale nie znalazłem czegoś takiego, który nie byłby błędem js-złego parametru.

Najlepsze, co mogłem znaleźć, to wybrać twoją truciznę dla ie8: Zrezygnuj z limitu maxHeight, więc element może mieć dowolną wysokość (najlepiej dla mojego przypadku), albo ustawić wysokość zamiast maxHeight, więc zawsze jest tak wysoki, nawet jeśli sama treść jest znacznie krótsza. Bardzo nie idealny. Wyczerpane zachowanie zniknęło w ie9.

Źródło

2011-08-18 18:57:37 enigment

Ustaw tylko wysokość maksymalną i nie ustawiaj przelewu. W ten sposób pokaże pasek przewijania, jeśli zawartość jest większa niż maksymalna wysokość i kurczy się, jeśli zawartość jest mniejsza niż maksymalna wysokość.

Źródło

2012-11-01 07:47:06

Znalazłem to: https://perishablepress.com/maximum-and-minimum-height-and-width-in-internet-explorer/

Ta metoda została zweryfikowana w IE6 i powinna także działać w IE5. Po prostu zmień wartości w zależności od potrzeb (kod skomentowany z uwagami wyjaśniającymi). W tym przykładzie mamy do ustawiania max-height w 333px 1 dla IE i wszystkie przeglądarki zgodne ze standardami:

* html div#division { height: expression(this.scrollHeight > 332 ? "333px" : "auto"); /* sets max-height for IE */ }

i to działa na mnie idealnie, więc postanowiłem podzielić się tym.

Źródło

2015-11-17 17:40:20

Przepełnienie IE8: auto z maksymalną wysokością

Odpowiedz

Aby odtworzyć:

Powiązane problemy