How to vertically align middle text in box sizing div?

Question

What i want to do is vertically align middle text(h3) in score-box according to height of image in ads-box. I have tried several ways to make it work, but no success till now. I'm also curious about how div's with box sizing (.ads-box & .score-box in my case) can be set with same height. Thanks in advance!

.current-scores {
  display: table;
  width: 100%;
  color: #ffffff;
  background-color: #01DFA5;
}
.current-scores .ads-box {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 80%;
  text-align: center;
  padding: 8px 10px;
  margin: 0;
  float: left;
}
.current-scores .score-box {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  width: 20%;
  text-align: center;
  padding: 8px 10px;
  margin: 0;
  float: left;
}
.current-scores .score-box h3 {
  font-size: 16px;
  line-height: 18px;
  font-weight: bold;
  margin: 5px 0 0;
  padding: 0;
}

<div class="current-scores">
  <div class="ads-box">
    <img class="img-responsive" src="https://s3.amazonaws.com/images.seroundtable.com/google-mobile-app-ad-1347454342.png" />
  </div>
  <div class="score-box">
    <h3>IND Vs AUS</h3>
    <h3>IND - 153/0</h3>
  </div>
  <div style="clear:both;"></div>
</div>

Jsfiddle : http://jsfiddle.net/racy2408/6hu1gLtq/

Answer 1

Updated your css .current-scores and .current-scores .score-box

/*Current Scores and Schedules*/
.current-scores {
display: table;
/*position: fixed;
left: 0;
right: 0;
bottom: 0; */
overflow: hidden;
width: 100%;
color: #ffffff;
background-color: #01DFA5;
padding: 0;
margin: 0;
position:relative;
}
.current-scores .ads-box {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 80%;
text-align: center;
padding: 8px 10px;
margin: 0;
float: left;
}
.current-scores .score-box {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
width: 20%;
text-align: center;
padding: 8px 10px;
margin: 0;
float: right;
position:absolute; 
top:50%; 
margin-top:-2em; 
right:0px;
z-index:1000;
}
.current-scores .ads-box img {
width: 100%;
height: auto;
}
.current-scores .score-box h3 {
font-size: 16px;
line-height: 18px;
font-weight: bold;
margin: 5px 0 0;
padding: 0;
text-transform: uppercase;
text-shadow: -1px 2px 3px rgba(30, 30, 30, 0.8);
}

Answer 2

position:relative;
transform:translate(-50%,-50%);
left:50%;
top: <number>%;