2014-01-06 3 views
0

내 사이트의 모바일 버전을 만들려고하지만 너비가 100 % 인 모든 요소가 내 컨테이너 섹션 위로 튀어 나오고 있습니다. 이것은 자식 요소가 채우기 값의 컨테이너보다 넓어지기 때문에 이해하지만 어떻게 전체 너비로 유지할 수 있지만 자식 요소 내에서 왼쪽에 약간의 채우기를 유지하면됩니다 (텍스트가 브라우저의 윈도우에 고정되어 있지 않음).)?RWD - 너비가 100 % 초과하는 요소

간단한 코드 :

section#main { 
    padding: 100px 0 0 !important; 
    width: 100%; 
    } 
    input, textarea { 
    width: 100%; 
    padding-left: 20px; 
    margin: 0; 
    } 

결과 :

http://tinypic.com/r/2ytxjk9/5

답변

1

당신은 기본적으로 말을하기 때문에, 100 % 넓은하지만 100 픽셀 패딩을 추가합니다. 가장 쉬운 방법은 CSS3 속성 box-sizing: border-box을 변경하는 것입니다. 이렇게하면 100px 패딩을 포함하여 100 % 폭이됩니다.

+0

IE8 호환성은 어떻습니까? – elemelas

+0

자, IE8에서도 작동합니다. 당신의 도움 사람을 보내 주셔서 감사합니다. – elemelas

관련 문제