Bootstrap3背景图片不适合div

Question

I have a small problem whit background image, I want to put it as a background for mine central div, see the picture:

Picture needs to fit in the div so text can display in the center of the image, its a simple stuff but for some reason mine image not fitting the div, can someone explain what is going on and tell me how can I overcome this.

Code for the background image:

.central_text{
    width:50%;
    height:50%;
    background: url(../img/circle/new11.png);
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

Here is an jsfiddle working example of this image.

I have used background:url(../img/circle/new11.png) center center no-repeat; and this will center mine image, but that only display a part of it not the whole image. So I got this:

And I want to make it like this:

Answer 1

See example: fiddle

CSS:

.central_text{
 background:url(../img/circle/new11.png) center center no-repeat;
}