당신이 내 머리카락을 감싸는 것 같지 않아 원인을 도울 수 있기를 바랍니다. overflow-x 인 한 가지를 제외하고는 잘 작동하는 한 페이지짜리 사이트를 만듭니다. 태블릿 뷰포트에 숨겨져 있습니다. (아마도 스마트 폰이기도하고 아직 테스트되지 않았습니다.)Overflow-x : 숨김; 모바일 장치에서 작동하지 않습니다
body {overflow-x:hidden;}
의 신체에도 불구하고 괜찮아, PC에서 정상적인 브라우저 내에서, 나는 약 25 픽셀 정도 측면으로 이동할 수 있어요, 그게 내가 숨기고 싶었던 화면 밖으로 스틱 내 회전 div의 오버 플로우가 발생합니다.
해결 방법이 있습니까? 나는 머리와 html/css의 일부 아래에 공급했다.
뷰포트 메타 태그.
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
CSS의 미디어 쿼리에 적용하고
@media only screen and (max-width: 992px){
#skills, #experience {overflow-x:hidden;}
}
@media (max-width: 479px){
body {overflow-x:hidden;}
}
오버 플로우 각각의 요소와 HTML/body 태그
body, html {height: 100%;width: 100%;font-family: 'Source Sans Pro',Helvetica,Arial,sans-serif;color: #757575; overflow-x:hidden;}
에 적용되는 일반 CSS ID입니다의 #skills
및 #experience
후속으로 정의되고 오버플로를 야기하는 .hoek
클래스가 있습니다.
.hoek {margin: 0 -50px;
-webkit-transform-origin:left center;
-moz-transform-origin:left center;
-o-transform-origin:left center;
-ms-transform-origin:left center;
margin-top: -175px;
-webkit-transform:rotate(5deg);
-moz-transform:rotate(5deg);
-o-transform:rotate(5deg);
-ms-transform:rotate(5deg);
z-index: 20;
}
나는 #skills
및 #experience
이 sections
하지 div의가 있다고, 나는 생각한다, 지적해야합니다. 코드 내에서 문제가 될지 모르겠지만 생각하지 않습니다. 더 이상 필요한 정보가 있으면 알려 주시기 바랍니다. 그러나 여기에서 기지를 다룰 수 있다고 생각했습니다.
는 어디서 바이올린으로 시작하는 몰라요, 그래서 나는 당신에게 사이트의 바로 테스트 링크를 제공합니다 : 모바일 deviced에
브라우저는 무시 : http://www.jellyfishwebdesign.nl/Joost/index.php
body 태그에서 넘쳐 흐르는 것이 무엇입니까? – vico
기울어 진 .hoek 클래스가있는 ID의 #skills 및 #experience가있는 섹션 – Dorvalla