디스플레이 중앙 정렬 : 인라인; 요소

-1

이 요소를 가운데에 배치 할 수 없습니다. 나는 이것이 디스플레이 때문이라고 생각한다 : 인라인; CSS 블록에서. 누구나 아이디어가 있습니까?디스플레이 중앙 정렬 : 인라인; 요소

<p class="mr">Monatliche Rate </p> 
<a class="info"> 
<div class="circle-text"> 
<div>?</div></div> 
<span> Netto-Rate</span> 
</a> 
<p class="mr">: 
<span id="results"></span> €</p>

CSS

.mr { 
color: #1d6912; 
font-size: 18px; 
font-weight: bold; 
margin-bottom: 5px; 
margin-top:2px; 

text-align:center; 
**display:inline;** 
}

출처

2014-06-24 user3772665

.mr을 (를) 센터링하려고합니까? – KRUKUSA

무언가를 내용의 너비 (디스플레이 : 인라인 포함)로 축소 한 다음 방금 제거한 여백 안에 가운데 놓으려고하면 어떤 점이 있습니까? –

.mr { 
    margin: auto; 
    display: table; 
}

: http://jsfiddle.net/mofeenster/6V6Z7/1/

가장 간단한 대답은 이것이다

출처

2014-06-24 20:35:45

그러나 OP는'inline'을 원합니다. 이것은'table'과 많이 다릅니다. 어쩌면 그는''inline-table''을 받아 들일 수도 있지만'margin : auto'는 그다지 중요하지 않습니다. – Oriol

그럴 경우 그 이유는 무엇입니까? –

덕분에 이것이 나에게 올바른 방향을주었습니다. 지금이 작품은 다음과 같습니다 : # m1, # info-box { display : table-cell; 세로 정렬 : 중간; } # m- 래퍼 { 디스플레이 : 표; } – user3772665

당신은 래퍼에 배치하고 래퍼에 text-align:center를 추가 할 수 있습니다. 귀하의 질문에 당신이 선택할 수있는 I가 3 예를 준비한 첫번째 답변에 따라

<div class="mr-wrapper"> 
    <p class="mr">Monatliche Rate</p> 
</div>

.mr-wrapper { 
    text-align:center 
} 
.mr { 
    display: inline; 
}

는

Demo

출처

2014-06-24 20:15:15 Oriol

디스플레이 중앙 정렬 : 인라인; 요소

답변

관련 문제