Udostępnij za pośrednictwem

Nieoczekiwane obliczenie wysokości tabeli w trybie standardów programu Internet Explorer

Ostrzeżenie

Wycofana, nieobsługiwana aplikacja klasyczna Internet Explorer 11 ma zostać trwale wyłączona za pośrednictwem aktualizacji aplikacji Microsoft Edge dla niektórych wersji systemu Windows 10. Aby uzyskać więcej informacji, zobacz artykuł pt. Często zadawane pytania dotyczące wycofywania aplikacji klasycznej Internet Explorer 11.

W tym artykule omówiono zamierzone zachowanie, że rozmiar tabeli jest zmieniany, jeśli używasz względnej wysokości tagu <div> w komórce tabeli w programie Internet Explorer.

Oryginalna wersja produktu: Internet Explorer
Oryginalny numer KB: 2778473

Podsumowanie

Jeśli używasz względnej wysokości znacznika <div> w komórce tabeli, możesz napotkać różne zachowania układu dla trybu standardowego i trybu zgodności w programie Internet Explorer. Na przykład:

<!DOCTYPE HTML>
<html>
    <body>
        <div style='height: 75px'>
            <table style='height:100%'>
                <tr>
                    <td>Row 1</td>
                </tr>
                <tr>
                    <td style='height:100%'>
                        <div style='height:100%'>Row 2</div>
                    </td>
                </tr>
            </table>
        </div>
    </body>
</html>

Jeśli przełączysz tryb dokumentu przy użyciu narzędzi deweloperskich, podczas sprawdzania układu zobaczysz inne zachowanie.

W powyższym przykładzie w trybie "quirks mode" tabela przyjmuje wysokość otaczającego <div> elementu, czyli 75 pikseli. Drugi wiersz przyjmuje całą pozostałą wysokość, a sama tabela nie zmienia swojego rozmiaru.

W trybie standardów rozmiar tabeli jest zmieniany, ponieważ wewnętrzny <div> tag wiersza tabeli 2 (wiersz 2) pobiera obliczoną wysokość od pierwszego elementu nadrzędnego o bezwzględnej wysokości, czyli 75 pikseli. Powoduje to zmianę rozmiaru całej tabeli, ponieważ oba wiersze nie mogą mieścić się w początkowej wysokości.

Więcej informacji

To zachowanie jest zaprojektowane i zostało wprowadzone w programie Internet Explorer 7 w 2006 roku. W przeglądarkach internetowych innych firm mogą być również widoczne różne zachowania. Obecnie nie ma możliwości zmiany tego zachowania przy użyciu tylko arkuszy CSS i tabel. Zachowanie to jest uznawane za ograniczenie modelu tabeli w trybie zgodności ze standardami. Model tabeli CSS uniemożliwia działanie tego scenariusza zgodnie z oczekiwaniami.

Tylko tryb dziwactw i emulacja trybu dziwactw (QME) obsługują to ze względów zgodności.