I would like to make the text box on the top of the blue box and the text in the text box will align middle. Here is my code on Fiddle.
.parent {
height: 60px;
width: 200px;
padding: 17px 15px 15px 15px;
margin-right: 10px;
float: left;
background: rgba(255,255,255,0.3);
font-size: 26px;
text-align: center;
border-top: 35px;
border-left: 1px;
border-right: 1px;
border-bottom: 1px;
border-color: #00bfff;
border-style: solid;
border-radius: 11px;
}
.parent > .child {
vertical-align: middle;
text-align: center;
background: #00bfff;
}
<div class="parent">
<div class="child">1111ggggggg1</div>
</div>