표시하지 않고 수레를 지움 속성

나는 수레를 지우는 예전의 학교 방법이 맑은 것을위한 클래스라는 것을 알고 있습니다. 둘 다 일반적으로 구식이었습니다.표시하지 않고 수레를 지움 속성

새로운 학교 방법은 폭 : 100 %; 오버플로 : 자동 또는 숨김;

하지만 부모 컨테이너의 경계를 넘어 동적으로 확장되는 콘텐츠가있을 때 나는 새로운 학교 방법을 사용할 수 없습니다. 이 시나리오에서 명확한 것보다 나은 방법이 있습니까? 둘 다요?

출처

2010-11-19 Matrym

이 스레드가 도움이 될 것입니다 : http://stackoverflow.com/questions/211383/which-method-of-clearfix-is-best –

@ 그릴 - 선택된 대답은 시대에 뒤 떨어지고 매우 나쁜 습관입니다. –

그녀의 좋아, 나는 통합하기위한 노력의 일환으로 이전 스레드를 게시 하지만 HTML5의 상용구에 따라이 사실상의 clearfix는 지금 :

http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified/

.clearfix:before, .clearfix:after { 
    content: "\0020"; display: block; height: 0; visibility: hidden; 
} 

.clearfix:after { clear: both; } 
.clearfix { zoom: 1; }

우리는 <br> 여기 그래서 웁니다 사용 새로운 학교 스타일에 힙합하지 않아. 죄송합니다.

출처

2010-11-19 21:23:24

두 가지 "새로운 학교"방법이 있습니다. 하나는 오버 플로우이고 다른 하나는 clearfix입니다.

새로운 학교 # 1 : 오버 플로우 visible하지만 아무것도

#el { 
    overflow:hidden; 
    zoom:1; 
}

값이 일으키는 새로운 블록 형식 컨텍스트를 자동으로 삭제하는 수레 만듭니다.

신학기 # 2 :

가

#el:after { 
    content:""; 
    clear:both; 
    display:block; 
} 
#el { zoom:1; }

clearfix 기본적 블록 레벨이고 요소 뒤에 영역을 클리어 보이지 않는 공백 "요소"를 생성한다. 그것은 당신을 위해 지우는 빈 div를 삽입하기위한 CSS 대체품입니다.

경계 밖으로 나가는 요소가 필요한 경우 # 2를 사용하십시오. 그렇지 않으면 # 1을 사용하십시오. zoom은 hasLayout을 트리거하고 el에 pre IE7에서 부동 소수점을 포함시킵니다. IE7 +는 overflow:hidden을 이해합니다.

EDIT : Grillz가 지적했듯이 content: "\0020";은 실제로 해당 경로로 이동하면 clearfix의 최신 최신 속성 값입니다. 공백과 관련하여 발생하는 렌더링 버그는 마침표, 빈 문자열 또는 공백 문자열 대신 해당 공백을 지정하여 해결할 수 있습니다.

는

출처

2010-11-19 21:14:54

+1하고 모든 것을 설명하기 위해 +1. –

표시하지 않고 수레를 지움 속성

답변

관련 문제