`overflow:hidden`을 사용할 때 IE9에서 내 테이블이 내 부동 요소 아래에 나타나는 이유는 무엇입니까?
- Linda Hamilton원래의
- 2024-12-02 12:23:16251검색
IE9 웹 페이지 요소 정렬 불량: 'Overflow:Hidden' 및 테이블 너비 관련 'Float' 문제
웹 페이지 레이아웃에서 인접한 테이블 요소의 너비가 100% 확장되도록 하면서 컨테이너 요소를 오른쪽으로 띄우려고 하면 표시 문제가 발생합니다. IE9.
문제:
테이블이 부동 요소 아래에 남아 있어 원하는 시각적 효과를 방해합니다. 배열.
코드:
<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>
해결 방법:
IE9 동작은 올바른 헤더를 확인하여 수정할 수 있습니다.
<!DOCTYPE html> <html> <head> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
이번 수정으로 테이블이 적절하게 확장됩니다. 플로팅된 요소와 올바르게 정렬됩니다.
위 내용은 `overflow:hidden`을 사용할 때 IE9에서 내 테이블이 내 부동 요소 아래에 나타나는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.