I am having trouble vertically aligning an input in my project. Interestingly, my code works for a span but not for the input! I'm puzzled - what could be the reason behind this?
Here is the CSS code snippet:
.float {
display: table-cell;
vertical-align: middle;
text-align: center;
}
div {
display: table;
border: solid 1px blue;
height: 120px;
}
And here is the corresponding HTML code snippet:
<div class="col-sm-12 ">
<span class='float'>Float right</span>
</div>
<div class="col-sm-12 ">
<input class='float' id='btnReport' name='btnReport' type='button' value='report' />
</div>