2013-08-22 3 views
1

OK, 나는 중심에 사업부가 있습니다고정되지 않은 너비의 div를 가로로 가운데에 배치하는 방법은 무엇입니까?

#spry { 
background-color: red; 
display: block; 
margin-left: auto; 
margin-right: auto; 
width: 400px; 
} 

하지만 사업부하지 고정 폭을 갖고 싶어 :

<div id="spry"> 
<p> hello there asdsdfasd adsfasdf aasdfasfd </p> 
</div> 

이 CSS를 사용합니다. 나는 내가 바꿀 수있는 것이라고 생각했다 width: 400px; to width: auto;

하지만 이렇게하면 전체 너비로 확장됩니다.

+1

당신은 그것을 변경할 수 있습니다 보여 단지 크기를 조정 표시 값은 인라인 - block''에있어 다음 사용과 같이 폭이 표시 볼 수 있습니다 센터,'부모에 컨테이너. – Adrift

+0

완벽한 답변. 그것을 하나로 게시하십시오! – Bojangles

+0

아주 의미가 없기 때문에 나는 그 일을 좋아하지 않습니다. 나는 텍스트가 아닌 div를 중심에두고 있습니다. –

답변

3

당신은 inline-block에 표시 값을 변경 한 다음 (이 일이 없기 때문에 난 그냥 예제로 <body>을 사용하지만) 부모 컨테이너에 text-align: center;을 사용할 수 있습니다 어떻게되는지보십시오

보다 400pixels 더 이상 이것은 본질적으로하지 않습니다라고하지만 당신은 더 작을 수있다 -
body { 
    text-align: center; 
} 

#spry { 
    background-color: red; 
    display: inline-block; 
} 

http://jsfiddle.net/3DBha/1/

+1

최상의 선택이지만, 어딘가에있는 다른 옵션을 보았습니다. '절대'/ '상대'위치 유형이 사용되고 '왼쪽'/ '오른쪽'속성으로 재생되었습니다. 찾으면 링크를 게시합니다. –

+0

사용자가 고정 또는 최대 너비 400px를 원한다면 작동하지 않습니다. 그렇지 않으면 좋았습니다. – Doidgey

+0

제목으로 판단 할 때, 그가 생각한 바는 아니지만 고정 너비가 있다면 – Adrift

-1

margin:0 auto;

+1

잘못된 구문입니다. –

+1

여백 : 0 자동; 이 경우에 올바른 구문이 될 것입니다 –

1

당신은 max-width를 사용할 수 있습니다. 창 크기를 조정하십시오.

이 고정 폭인을 원하지 않으면이 옵션을 사용하는 것이 좋습니다. 또는 비율을 시도한 다음 max-width을 사용하여 최대 너비를 정의 할 수 있습니다.

DEMO

`텍스트 정렬이

관련 문제