부모가 자식 요소를 기준으로 너비를 조정하지 않습니다.

Question

Safari에서 동적 인 vw CSS 단위를 너비와 높이로 사용하면 부모 요소 (지정된 차원 없음)가 자식 요소의 너비 차원으로 조정되지 않습니다. 이 문제에

http://jsfiddle.net/gby3N/

어떤 아이디어 나 해결책 : 다음은 바이올린과 일부 스크린 샷은?

Answer 1

Safari 7.0.4에서 동일한 동작이 발생했으며 Safari 버그라는 점만 설명하면됩니다. 내가 사파리에 대해 이야기하는 사람들 만이 문제를 겪고있는 것을 알 수 있기 때문에 이상하다. 데스크톱 사파리에 대해서는 아무 것도 없다.

다행히도 iOS Safari의 뷰포트 단위 처리 문제를 해결하는 "buggyfill"은 https://github.com/rodneyrehm/viewport-units-buggyfill으로 여기에서도 효과가있는 것으로 보입니다. 난 그냥 사파리에서 child에 맞게 스트레칭 parent를 얻을 수

<script src="https://rawgit.com/rodneyrehm/viewport-units-buggyfill/master/viewport-units-buggyfill.js"></script> 
<script>window.viewportUnitsBuggyfill.init(true);</script> 

를 추가했다. iOS 사용자 에이전트를 확인하는 init() 대신 init(true)을 사용했음을 유의하십시오.

데모 : 당신은 단순히 부모 요소에 min-width: 12vw;를 추가 할 수있는 옵션이있을 수 있습니다 http://jsfiddle.net/gby3N/2/

. (12vw은 자식 요소의 너비입니다.)