Javascript 居中标签和输入文本框

我有以下带有标签的输入文本字段的标记

<div>

    Start Date:
    <input type="date" id="reportsStartDate">

    End Date:
    <input type="date" id="reportsEndDate">

</div>

开始日期：
结束日期：

看起来是这样的

如您所见，文本框的标签位于文本框的下部。如何设置此选项，使标签位于文本框的中心，如下图所示

---

您可以在标签上添加填充物，将其与输入的高度对齐，例如a和内部，以提供标签。

垂直对齐：需要中间对齐。如果您的输入是一个
显示：内联块
，它可以工作。
您可以创建问题的
jsfiddle
，看看这里：我用这个代码和chrome标签创建了一个小提琴，并且输入垂直居中编辑已经可以像您所需的输出一样工作了。