모바일 용 끈적한 바닥 글

Question

부트 스트랩 3 (http://www.patrickmanser.ch/fnws)을 사용하여 웹 사이트에서 작업하고 코드에 끈적 끈적한 꼬리말을 넣기를 원합니다. 부트 스트랩 3 예제에 사용 된 코드를 적용하여 크기를 조정했습니다. 그것은 데스크탑 모니터에서 완벽하게 작동합니다. 그러나 모바일 크기의 화면으로 전환하면 바닥 글이 내용과 겹칩니다. 나는 그리드 시스템을 사용함에 따라 바닥 글의 크기 (높이)가 바뀌기 때문에 그럴 것입니다. 당신은 소스 코드 (main.css가)에서 볼 수 있지만, 내가 생각하는 가장 중요한 부분은 다음과 같습니다

html { 
    position: relative; 
    min-height: 100%; 
} 

body { 
    margin-bottom: 237px; 
    overflow-y: scroll; 
    background-color: #eee; 
} 

#page-footer { 
    position: absolute; 
    bottom: 0; 
    min-height: 200px; 
    background-color: #333; 
    width: 100%; 
    color: #999; 
} 

.copyright { 
    background-color: #222; 
    min-height: 50px; 
    color: #666; 
    width: 100%; 
    text-align: center; 
    line-height: 50px; 
} 

내가조차 제대로 해결 될 수있는 경우이 문제를 해결하거나하는 방법을 모른다. 모든 힌트를 많이 주셔서 감사합니다!

Answer 1

.copyright에있는 "min-height : 50px;"입니다.

"높이 : 50px;"로 변경하면 상단 본체 내용에 대해 밀어 넣기가 줄어 듭니다. 너는 너의 선 높이를 50px 수용하기 위하여 그것을 강요하지 않는다 그래야 그것을 조정할 필요가있다;

이 중 하나를 사용하면 선 높이를 20px와 같이 짧게 줄일 수도 있습니다. 또한 모바일에있을 때 몸의 내용까지 밀어 넣기가 줄어 듭니다.

필자는 선 높이를 먼저 줄여서 수정했는지 확인한 다음 "최소"를 삭제하여 도움이되는지 확인하려고합니다.