Mengapa Jadual Saya Muncul Di Bawah Elemen Terapung Saya dalam IE9 Apabila Menggunakan `overflow:hidden`?-tutorial css-php.cn

Mengapa Jadual Saya Muncul Di Bawah Elemen Terapung Saya dalam IE9 Apabila Menggunakan `overflow:hidden`?

Linda Hamilton

Lepaskan： 2024-12-02 12:23:16

asal

238 orang telah melayarinya

Why Do My Tables Appear Below My Floated Element in IE9 When Using `overflow:hidden`?

Salah Jajaran Elemen Halaman Web IE9: Isu 'Apung' dengan 'Limpahan:Tersembunyi' dan Lebar Jadual

Dalam susun atur halaman web, cuba mengapungkan elemen bekas dengan betul sambil memastikan elemen jadual bersebelahan memanjangkan lebar 100% menghadapi isu paparan dalam IE9.

Masalah:

Jadual kekal di bawah elemen terapung, mengganggu visual yang diingini susunan.

Kod:

<head>
<style>
.container{margin:0 auto; min-width:1000px; max-width:1200px;}
.sidebar{float:right;width:300px;margin-left:5px;}
.tholder{overflow:hidden;}
</style>
</head>
<div class="container">
<div class="sidebar">
<img src="dsfd.jpg" heigh="600" width="295">
</div>
<div class="tholder">
<table><tr<td>Text</td></tr></table>
</div>
<div class="tholder">
<table><tr<td>Test goes here</td></tr></table>
</div>
<div class="tholder">
<table><tr<td>text</td></tr></table>
</div>
</div>

Salin selepas log masuk

Penyelesaian:

Tingkah laku IE9 boleh dibetulkan dengan memastikan pengepala yang betul:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />

Salin selepas log masuk

Dengan pengubahsuaian ini, jadual akan dilanjutkan dengan sewajarnya, menjajarkan dengan betul dengan unsur terapung.

Atas ialah kandungan terperinci Mengapa Jadual Saya Muncul Di Bawah Elemen Terapung Saya dalam IE9 Apabila Menggunakan `overflow:hidden`?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!