為什麼「overflow:hidden」在 IE6 和 IE7 中不能與「position:relative」一起使用？-css教學-PHP中文網

為什麼「overflow:hidden」在 IE6 和 IE7 中不能與「position:relative」一起使用？

DDD

發布： 2024-11-02 14:06:03

原創

388 人瀏覽過

Why Does `overflow: hidden` Not Work with `position: relative` in IE6 and IE7?

解決IE6 和IE7 中的Overflow: Hidden 和Position:relative 的CSS 問題

在Internet Explorer 6 和7 中遇到與溢出：隱藏和位置相關的CSS 問題時:relative，通常有一個特定的罪魁禍首阻礙了預期的功能。

在提供的程式碼片段中，問題可以歸因於應用於 ul 元素的position:relative 屬性。雖然此屬性對於滑桿的功能至關重要，但它會無意中破壞 item-list div 上的 Overflow:hidden 屬性。

要解決此問題，請新增相對於body 元素的位置：相對於body 元素，如修改後的程式碼如下：

<code class="html"><body>
  <div style="position:relative;">  <!-- New div with position:relative -->
    <div class="column-1">
      <div class="item-list clearfix">
        <!-- Rest of the code remains the same --></code>

登入後複製

此新增建立了一個帶有position: relative的新容器，有效地隔離了ul元素的定位，並允許item-list div上的overflow:hidden屬性按預期工作。因此，非活動幻燈片將被成功隱藏。

以上是為什麼「overflow:hidden」在 IE6 和 IE7 中不能與「position:relative」一起使用？的詳細內容。更多資訊請關注PHP中文網其他相關文章！

php8，我來也

30分鐘學會網站佈局

尚觀Oracle入門到精通視頻教程

你的第一行UNI-APP程式碼

Flutter 從頭到應用程式啟動

兄弟連新版Linux視頻教程

AXURE 9影片教學（適用於產品經理互動產品設計UI）

零基礎PS影片教學

16天帶你入門UI視頻教程

PS技巧和切片技巧影片教學

阿裡雲環境搭建以及項目上線視頻教程

電腦網路概述－程式設計師必須掌握的基礎知識

程式設計師必備教學——HTTP協定講解

Websocket影片教學

為什麼「overflow:hidden」在 IE6 和 IE7 中不能與「position:relative」一起使用？

解決IE6 和IE7 中的Overflow: Hidden 和Position:relative 的CSS 問題