끈끈한 바닥 글 오류

나는 바닥 글을 올리려고하는데 문제가 있습니다. 나는 페이지 바닥에 꼬리말을 붙일 수 있었지만 창문이 작아지면 곧 내용을 덮어 버리는 것을 깨달았다. 위치를 없애면 문제를 해결할 수 있습니다. 그러나 이렇게하면 바닥 글이 더 이상 페이지 하단에 있지 않습니다.끈끈한 바닥 글 오류

나는이 작업을 얻기 위해 다른 많은 것들을 시도했지만, 이것이 내가 현재, 나는 누군가가 여기에 몇 가지 조언을 빌려 수 바라고에서 무엇을 찾고 있습니다 ..

CSS 코드 :

html, body { 
    margin: 0; 
    padding: 0;  
    height:100%; 
} 
#wrapper { 
    width:900px; 
    background-color:#FAFAFA; 
    min-height:100%; 
    margin:0 auto -45px; 
    height: auto !important; 
    height:100%; 
} 
#content{ 
    margin-top:40px; 
    float: left; 
    padding-left:100px; 
    padding-bottom:30px; 
    overflow:auto; 
} 
#footer{ 
    height:30px; 
    bottom:0; 
    background:#D2CFCF; 
    width:900px; 
    clear:both; 
    position:absolute; 
}

최근 바닥 글에 margin-top : -30px를 사용하고 position : relative를 시도했습니다. 위의 코드를 사용하면 바닥 글이 멋지고 바닥에 꽂히지 만 창을 작게 만들 때 내용을 다룹니다. 내가 무엇을 할 수 있을지?

<body> 
    <div id="wrapper"> 
     <div id="content"> 
     </div> 
     <div id="footer"> 
     </div> 
    </div> 
</body>

출처

2012-09-04 jackie

그리고 HTML 코드! – Enve

우수 답변 - 제발하지 마십시오. 끈적한 바닥 글은 작은 화면에서 모든 종류의 접근성 문제를 일으 킵니다. 많은 사용자는 물론 짜증나게합니다. –

jQuery Mobile은 고정 된 바닥 글을 사용하여 작은 화면에 큰 효과를줍니다. 고정 된 바닥 글은 반드시 나쁜 것은 아닙니다. 기술이 어떻게 사용되는지에 따라 다릅니다. – leepowers

바닥 글과 <body> 태그에 바닥 margin에 position: fixed; 규칙을 사용하여 다음과 같이 HTML 기본적이다. 창 크기에 따라 바닥 글이 때로는 내용을 다룰 것

http://jsfiddle.net/JGUYh/

BODY { 
margin: 0 0 60px 0; /* keep regular content clear of the footer */ 
} 
#footer { 
position: fixed; 
width: 100%; 
height: 50px; 
bottom: 0px; 
background: #ccc; 
overflow: hidden; 
}

참고. 그러나 스크롤하면 숨겨진 내용이 표시됩니다.

출처

2012-09-04 21:18:26 leepowers

감사합니다. 콘텐츠를 전혀 다루지 않는 콘텐츠를 찾을 수 있었으면 좋겠다고 생각 했었습니다. 의견에 다른 사람들의 해결책을 시도 할 것입니다. – jackie

끈끈한 바닥 글 오류

답변

관련 문제