css - 居中显示 :inline; element

Question

我无法将这个元素居中。我相信这是因为 display:inline;在 CSS block 中。有人有想法吗？

 <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;**
}

Answer 1

您可以将它放在包装器中，然后将 text-align:center 添加到包装器中。

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

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

Demo