CSS Centering of Image

I'm working in visual studio with the following code, however, the URL images refuse to center in the columns like the h2 tags did. ive tried multiple options such as

  background-image: url('http://ift.tt/1AQYkuF');
  background-position: center center;
  background-repeat: no-repeat;

also

  background: url('http://ift.tt/1AQYkuF') center center;
  background-repeat: no-repeat;

here is the full section of code:

      <div class="col-md-4">
    <h2 style="text-align: center;">Version 1.0</h2>

    @*EDIT________________BUTTON1 THAT TAKES USER TO A CREATE PAGE FOR SPECIFIC SONG TYPE(KEY)*@
    <style type="text/css">
        .urlImg1 {
            width: 200px;
            height: 200px;
            display: block;
            background-image: url('http://ift.tt/1vFE00g');
            background-repeat: no-repeat;
        }

            .urlImg1:hover {
                background-image: url('http://ift.tt/1AQYimw');
            }
    </style>
    <a href="http://ift.tt/Njz38V" class="urlImg1" title="Corelangs link"></a>
    @*END BUTTON#1_____________________________________*@
</div>

<div class="col-md-4">
    <h2 style="text-align: center;">Version 2.0</h2>

    @*EDIT________________BUTTON2 THAT TAKES USER TO A CREATE PAGE FOR SPECIFIC SONG TYPE(KEY)*@
    <style type="text/css">
        .urlImg2 {
            width: 200px;
            height: 200px;
            display: block;
            background-image: url('http://ift.tt/1AQYkuF');
            background-repeat: no-repeat;
        }

            .urlImg2:hover {
                background-image: url('http://ift.tt/1AQYimz');
            }
    </style>
    <a href="http://ift.tt/Njz38V" class="urlImg2" title="Corelangs link"></a>
    @*END BUTTON#2_____________________________________*@
</div>