에서는 예 이미지 중심 아니다. 왜? 내 브라우저는 IE가 아닌 Windows 7의 Google Chrome v10입니다.
<img src="/img/logo.png" style="margin:0px auto;"/>
답변
추가 display:block;
하면 작동합니다. 이미지는 기본적으로 인라인입니다.
명확히하기 위해 block
요소 의 기본 너비 는이며 auto
, 물론 포함하는 요소의 사용 가능한 전체 너비를 채 웁니다.
에 여백을 설정함으로써 auto
반 브라우저 양수인에 남은 공간, margin-left
그리고에 나머지 절반 margin-right
.
답변
어떤 상황에서 상속 (예 : IE, 도마뱀 붙이, 웹킷의 이전 버전으로)을 가진 요소는 position:relative;
방지 할 수 있습니다 margin:0 auto;
경우에도 작동 top
, right
, bottom
, 그리고이 left
설정되지 않습니다.
요소를 position:static;
(기본값) 로 설정하면 이러한 상황에서 문제가 해결 될 수 있습니다. 일반적으로 지정된 너비를 가진 블록 레벨 요소 margin:0 auto;
는 relative
또는 static
위치 지정을 사용합니다 .
답변
자동 너비 div를 중앙에 배치 할 수 있습니다. display:table;
div{
margin: 0px auto;
float: none;
display: table;
}
답변
제 경우 문제는 너비 자체 없이 최소 및 최대 너비 를 설정했다는 것입니다.
답변
너비를 추가하지 않고 추가 할 때마다 margin:auto
작동하지 않을 것이라고 생각합니다. 제 경험입니다. 너비는 정확히 동일한 여백을 제공해야하는 위치에 대한 아이디어를 제공합니다.
답변
에 대한 대안이 margin-left:auto; margin-right: auto;
또는 margin:0 auto;
사용하는 사람을위한 position:absolute;
이 어떻게되어
(당신이 50 %로 요소의 왼쪽 위치를 설정left:50%;
)하지만 올바르게 중심되는 요소의 순서를 제대로 중심을하지 않습니다 당신은 그것을 줄 필요 너비의 절반을 뺀 여백은 요소를 완벽하게 중앙에 배치합니다.
다음은 예입니다. http://jsfiddle.net/35ERq/3/
답변
부트 스트랩 버튼의 경우 :
display: table;
margin: 0 auto;