2010-06-09 5 views
1

다음 예제에 문제가 있습니다.IE 7 floated div 다음 요소 자동 지우기?

배경 : 나는 내부에 이미지 출력이있는 오른쪽으로 플로팅 된 요소가 있습니다. 그 안에 다른 콘텐츠가 포함 된 요소가 있습니다.

예상대로 FF와 IE 8에서는 .images div가 오른쪽으로 플로트되어 오른쪽으로 플로팅되어 .product-body div의 내용을 왼쪽으로 멋지게 밀어 넣습니다.

문제 : IE 7 호환 모드에서 볼 때는 단, .product 바디 사업부는 예상대로 오른쪽으로 잘 빠지지 않는 .images div에 따라서 .images div의 아래에 삭제됩니다. IT 부서는 내가 분명히했는지 여부에 관계없이 다음을 수행합니다. .broduct-body div에.

www.hotelmarketingbudget.com의 예제를 참조하십시오. div 요소 # content-body에서 소스 코드를 보면이 div를 볼 수 있습니다. Firebug 나 IE Dev 툴바 또는 이것 저것을 자유롭게 사용해보십시오.

관련 CSS :

#content-body{ 
width:auto; 
height:auto; 
position:relative; 
margin:0 auto; 
} 

.product-group .images { 
float:right; 
width:auto; 
height:auto; 
position:relative; 
margin:0 auto; 
margin-left:15px; 
} 

.product-group .product-body { 
width:auto; 
height:auto; 
position:relative; 
margin:0 auto; 
} 

I에 유래 여기에 다른 스레드를 읽고, this- 인터넷 검색을 해결하는 방법을 알아 내려고 이미 시간을 보냈지 만 한 내가 어떤 해결 방법을 찾을 수 있으며 하드의 아아 검색 할 단어가 무엇인지 알 수 있습니다. 나는 이것이 정말로 내 두뇌 방귀 일 뿐이라고 기대하고있다.

모든 조언이나 아이디어 또는 질문은 대단히 감사하겠습니다!

+0

수정 해 주셔서 감사합니다. zildjohn01 –

답변

0

부동 한 콘텐츠에 고정 너비를 할당 해보십시오 (width:250px). 나는 고정 된 너비를 가지고 있지 않다면 IE의 오래된 버전이 수레를 잘 다루지 못한다는 것을 안다.

나는 이것이 아마 hasLayout의 문제입니다 생각, 그래서 당신이이 버그가 존재하는 이유에 대해 궁금하다면, 이것은 정말 좋은 읽기입니다 : 당신은을 할당하고 싶지 않은 경우

http://www.satzansatz.de/cssd/onhavinglayout.html

고정 너비, 시도 할 수있는 다른 해킹 hasLayout은 min-width: 1%zoom: 1입니다.

+0

답변 해 주셔서 감사합니다. 나는 또한 당신의 초기 제안을 생각해 봤지만 그것도 효과가 없다. 이 CSS로 업데이트 된 페이지를 지금보십시오 : . product-group .images { \t float : right; \t 너비 : 400px; \t 신장 : 자동; \t 위치 : 상대적; \t 여백 : 0 자동; \t margin-left : 15px; } 여전히 문제가 지속됩니다 ... –

+0

의견을 보내 주셔서 감사합니다. 시간이 지나면 읽습니다. –

+0

누군가 더 이상의 조언이 있습니까? –