선택적으로 IE7에서 플로트 항목을 제거합니다

Question

왼쪽에있는 5 개의 항목 목록이 있고 인라인으로 표시됩니다. 4RD 항목에서는 왼쪽으로 왼쪽으로 설정되어 4 번째 항목을 새 줄로 만들어냅니다.

그러나 IE7에서는 새로운 선의 4 번째 항목 옆에 떠있는 대신 첫 번째 라인의 3 번째 항목 옆에 5 번째 항목이 수레입니다.IE7에서 작동하는 데 어떻게 작동하는지 아이디어?

test : http://jsfiddle.net/3dssp/4/4/a>

Answer 1

나는이 일을 여러 번 왔고 불행히도 내가 알고있는 유일한 솔루션은 부유물을 지우는 분리 된 청소 요소를 갖는 것입니다.

그것은 추악하지만 작동합니다 :

<ul>
  <li>List 1</li>
  <li>List 2</li>
  <li>List 3</li>
  <li class="clear">&nbsp;</li>
  <li>List 4</li>
  <li>List 5</li>
</ul>

.

CSS :

.clear{
  display: block;
  float: none;
  clear: both;
  height: 1px;
  line-height: 1px;
  font-size: 1px;
}

.

및 글꼴 선언은 지우기 DIV가 1 픽셀 만 뿐이는 것을 보장합니다. 그렇지 않으면 현재 글꼴 크기 (예!)의 높이가됩니다.

IE7에만 해당 에 대해 자바 스크립트로 마크 업을 깨끗하게 하고이 여분의 GUFF를 동적으로 추가 할 것입니다.