CSS : 고정 된 div 중앙에

Question

고정 된 위치가 지정된 div에 대한 클래스가 뷰 포트의 맨 아래에 머물러 있습니다. div가 너비를 변경하면 가운데로 유지되도록 너비를 자동으로 만들려고합니다.

.box { 
position: fixed; 
width: 80%; 
bottom: 20px; 
left: 50%; 
margin: 0 0 0 -40%; 
max-height: 50%; 
overflow: auto 
} 

아이디어가 있으십니까? 나는 텍스트 정렬을 사용하는 컨테이너를 시도했다. : center, display : inline, 그러나 그것은 미친 결과를 낳았다.

Answer 1

.box { 
    position : fixed; 
    left  : 10%; 
    right  : 10%; 
    bottom  : 20px; 
    max-height : 50%; 
    overflow : auto; 
} 

당신은 (대신 폭을 사용) 요소를 중심으로 함께 left 및 right를 사용할 수 있습니다. 당신이 폭을 사용하려면

당신은이 작업을 수행 할 수 있습니다

.box { 
    position : fixed; 
    left  : 10%; 
    width  : 80%; 
    bottom  : 20px; 
    max-height : 50%; 
    overflow : auto; 
} 

을 당신이 할 수있는 고정 요소 안에 HTML을 중심하려는 경우 : 여기

.box > div { 
    width  : 50%; 
    min-width : 150px; 
    margin  : 0 auto; 
    text-align : center; 
} 

데모입니다 : http://jsfiddle.net/dFXt5/

Answer 2

.centered { position: fixed; top: 50%; left: 50%; margin-top: -[1/2(element-height)]; margin-left: -[1/2(element-width)];} 

이 작품.