Div not cetnering correclty

[garyjohnson]

I have a div, which is a contanier. Inside is another div that displays numbers.

<div class="commentie_box">
  <div class="commentie_number">
  1234567890
  </div>
  </div>

Here is the css

.commentie_box{
float:right;
width:260px;
padding-top:10px;
height:49px;
border:1px solid #0FF;  
}

.commentie_number{
    position:relative;
    margin:0 auto;
    padding:5px;
    padding-top:2px;
    padding-bottom:2px;
    width:auto;
    height:35px;
    background-color:#fff;
    border-radius:5px;
    text-align:center;
    font-size:25px; 
}

I am trying to get the commentie_number to center in the commentie_box and have the width of the number 1234567890, but this number changes from php. So the number could be 12345 or 12. The inner div needs to be able to change its size automatically to the length of the number and be centered in the outer div. As of now the inner div when set to width auto will expand to the length of the outer div and not the length of the numbers.

[AleMonteiro]

Div's width by default is 100% of it's parent.
In your case I think it would be easier to use an <span>, wich the width just wrap it's content.

Or you can set display: inline to the div, wich will make it just wrap it's content.

[garyjohnson]

Thanks for the response! Never thought about using a span! Works wonderfully.