Warum funktioniert „overflow: hide' nicht mit „position: relative' in IE6 und IE7?-CSS-Tutorial-php.cn

Warum funktioniert „overflow: hide' nicht mit „position: relative' in IE6 und IE7?

DDD

Freigeben： 2024-11-02 14:06:03

Original

388 Leute haben es durchsucht

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

Beheben von CSS-Problemen mit Overflow: Hidden und Position: Relative in IE6 und IE7

Beim Auftreten von CSS-Problemen in Internet Explorer 6 und 7 im Zusammenhang mit Overflow: Hidden und Position : relative, oft gibt es einen bestimmten Schuldigen, der die beabsichtigte Funktionalität behindert.

Im bereitgestellten Code-Snippet kann das Problem der Position: relative-Eigenschaft zugeschrieben werden, die auf das ul-Element angewendet wird. Obwohl diese Eigenschaft für die Funktionalität des Schiebereglers unerlässlich ist, unterbricht sie versehentlich die overflow:hidden-Eigenschaft im item-list-div.

Um dieses Problem zu beheben, fügen Sie position: relativ zum Body-Element hinzu, wie in der Abbildung gezeigt Überarbeiteter Code unten:

<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>

Nach dem Login kopieren

Dieser Zusatz erstellt einen neuen Container mit position: relative, wodurch die Positionierung des ul-Elements effektiv isoliert wird und ermöglicht wird, dass die overflow:hidden-Eigenschaft im item-list-Div wie erwartet funktioniert. Folglich werden die nicht aktiven Folien erfolgreich ausgeblendet.

Das obige ist der detaillierte Inhalt vonWarum funktioniert „overflow: hide' nicht mit „position: relative' in IE6 und IE7?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!