CSS 在标签字段中居中对齐

我正在尝试显示类似这样的内容：

* Please treat the blue line and black line as the border

其中图像描述文字应该是水平的位于剩余空间的中心，但是我不知道应该应用什么CSS。

这是我的小提琴：https://jsfiddle.net/65ky0zLg/ https://jsfiddle.net/65ky0zLg/

HTML:
<div>
  <img src="http://lh3.googleusercontent.com/mjejVTJKT4ABNKq2HGlkDs36f-QvzI2hKFER098vBIgiAoZ2H-SN5QPvFaZEVDZRxfujrS6pszZ_J-_di2F57w0IFE3KAciDwGAh-9RcCA=s660" style="width: 20%; padding: 2% 2% 0% 2%" alt/>
  <label class="lbl">Martin Luther King, Jr. Day 2015</label>
</div>

CSS:
.lbl {
  font-size: larger;
}

删除 float:left 并仅使用与图像垂直对齐即可。尝试以下：

<div>
  <img src="http://lh3.googleusercontent.com/mjejVTJKT4ABNKq2HGlkDs36f-QvzI2hKFER098vBIgiAoZ2H-SN5QPvFaZEVDZRxfujrS6pszZ_J-_di2F57w0IFE3KAciDwGAh-9RcCA=s660" style="width: 20%; vertical-align:middle" alt/>
  <label class="lbl">Martin Luther King, Jr. Day 2015</label>
</div>

EDIT:上面将垂直对齐文本。如果您想水平对齐，请执行以下操作：

<img src="http://lh3.googleusercontent.com/mjejVTJKT4ABNKq2HGlkDs36f-QvzI2hKFER098vBIgiAoZ2H-SN5QPvFaZEVDZRxfujrS6pszZ_J-_di2F57w0IFE3KAciDwGAh-9RcCA=s660" style="width: 20%;" alt/>
<label class="lbl">Martin Luther King, Jr. Day 2015</label>

并使用下面的CSS：

.lbl {
    font-size: larger;
    position:absolute;
    text-align:center;
    bottom:0;
    width:100%;
    left:10%;
  }

工作计划：Plnkr http://plnkr.co/edit/jz7FhV206HAtbnmbgWl4?p=preview