2013-11-05 2 views
0

내 도움 파일에 반응 형 YouTube 동영상을 추가하려고하지만 동영상이 상위 div에 포함되어 있지 않고 오버플로됩니다. 여기에 제안 된 많은 수정 프로그램을 시도했지만 아무 것도 작동하지 않는 것 같습니다. 나는 누군가가 올바른 방향으로 나를 가리킬 수 있는지 궁금해. 내가 여기에 대해 볼 수 무슨 말의 예 :부모 div에 CSS 부동 요소가 포함되어 있지 않습니다.

아이디 : : 스티커 암호 : http://designasticker.com.au/help.php 당신은 페이지를 보려면 다음 사용자 이름과 암호를 사용해야합니다 al765bd

+0

로그인하지 못했습니다. – Ming

답변

0

음, 이것은 단순히 떠있는 문제입니다. 요소를 플로트 할 때, 문서 플로우에서 요소를 제거합니다. 즉, 부모는 더 이상 플로팅 자식이 있음을 인정하지 않습니다.

당신이 경우, 부모에게, .displayScreen 행을 의사 요소 후 ::를 추가하여이 문제를 해결할 수 있습니다

.displayScreen-row:after { clear: left; 
    display: block; 
    height: 0; 
    visibility: hidden; 
    content: ' '; } 

이 표준을 준수하는 브라우저에서 작동하지만,하지의 것

IE 6 :

.displayScreen-row { height: 100%; } 

IE 7 :

을 IE 6이 두 브라우저 7. 당신과 같이 해결해야 할 (조건부 주석을 사용, 만을 대상으로)
.displayScreen-row { min-height: 100%; } 

IE 6과 7은 높이를 설정하면 부양 된 아동을 인정할 수 있습니다.

+0

예, 다른 곳에서이 수정본을 보았습니다. 그러나이 경우 문제를 해결하지 못하는 것 같습니다. –

+0

수정이 진행 중입니다 ... 문제는 이제 .displayScreen-left와 .displayScreen-right 모두 고정 높이가 100px입니다. 만약 당신이 그들을 제거하면, 잘 작동 플로트 삭제를 볼 수 있습니다. – Ming

+0

나는 css에 관해서 그런 마구 자국이다. 처음에는 배경색을 추가 했으므로 div를 더 잘 볼 수있었습니다. 배경색은 삭제되었지만 높이는 잊어 버렸습니다. 다시 한번 감사드립니다. –

1
EDIT 

부정적인 추가 마진 :

margin: -120px; 

하고있는 iframe 비디오의 크기를 조정 :

<iframe width="YOUR INPUT" height="YOUR INPUT" src="//www.youtube.com/embed/-JWT_tC8_iE" frameborder="0" allowfullscreen></iframe> 

"YOUR INPUT"을 사용자 정의 너비와 높이로 바꿉니다.

관련 문제