CSS : 하단 고정 메뉴 중앙 맞춤 방법

Question

페이지 중앙 하단에 고정시키고 싶은 메뉴 막대를 만들었습니다. 나는 모든 것을 시도했다. CSS에서이 작업을 수행 할 수있는 방법이 있습니까? 0 픽셀 위치 : 고정

만 사용

마진 : 자동 자동 0 픽셀 자동 또는 여백 왼쪽 : 자동

나는

하단에있는 페이지의 하단에 고정 할 수있는 메뉴를 왔

은 메뉴 가운데에없는 것으로 보입니다. 그것은 단지 페이지의 왼쪽에 붙어 있습니다. 어떤 생각이라도 대단히 감사하겠습니다!

Answer 1

http://jsfiddle.net/N7MB5/

는 자동으로 너비와 세트 좌우 여백을 지정해야 요소를 중심으로합니다. 그런 다음 페이지의 아래쪽에 이러한 요소를 붙여 넣으려면 너비가 고정 된 다른 요소 (예 : 100 %)에 줄 바꿈을하고 아래쪽에 배치해야합니다. 그리고 네, 할 수 있습니다.

<section style="position: fixed; bottom: 0px; width: 100%;"> 
<p style="margin: 0 auto; width: 300px;">Blah blah</p> 
</section> 

Answer 2

#myElemId { 
    width: 100px; 
} 

고정 폭에 유의하십시오. margin: auto이 작동하는 데 필수적입니다. 이것이 해결되지 않으면 다른 곳에 문제가있을 것입니다.

편집 : 당신은이 (jQuery를)해야합니다 : 이것은 당신이 CSS 코드의 나머지 부분을 업데이트 할 필요없이 당신이 원하는대로에 폭을 설정할 수 있습니다

$("#myElemId").css({ 
    left: window.innerWidth/2 - $(this).css("width")/2 
}); 

.

Answer 3

왼쪽 속성 50 %와 음수 왼쪽 여백을 바닥 글 너비의 절반에 사용할 수 있습니다.

#footer { 
    width: 600px; 
    position: fixed; 
    bottom: 0; 
    left: 50%; 
    margin-left: -300px; 
}