Search code examples
cssalignmentcenterinline

Centering a Display:inline; element

I can´t center this element. I believe it is because of display:inline; in the CSS block. Does anyone have an idea?

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

  • based on your question and the 1st answer I have prepared 3 examples for you to choose from: http://jsfiddle.net/mofeenster/6V6Z7/1/

    The simplest answer is this:

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