我的图像破坏了我的文本样式，我该如何解决？答案

【问题标题】：My image is ruining my text styling, how can i solve this?我的图像破坏了我的文本样式，我该如何解决？
【发布时间】：2014-03-09 18:46:23
【问题描述】：

我创建了一个简单的文本标签，其中包含一个输入字段和一个图像：

<p><label for="something" style=" padding: 5px; display:inline-block; width: 440px; border:1px solid white;">Something Since<input type="text" id="datepicker" size="7" readonly></label></p>

对于所有其他文本标签，没有得到 id datepicker（其中包含一个图像，当单击图像时会弹出一个 daterpicker 弹出窗口），文本会自动居中在框中。图像文本不是这种情况..

这里有一张更清晰的图片：

任何人都知道我该如何修复它，以便文本和图像也在内联框中居中？

【问题讨论】：

I 总是大写。
我们会有一些想法，但我们至少需要您的 html 和 css 来摆弄我们自己。也许也可以创建一个jsfiddle.net，为什么还要使用paragraph 标签来包含输入/标签？

标签： html css image styles center

【解决方案1】：

要将图像和文本居中放在一行中，您可以将vertical-align: middle 应用于您的图像，如下所示：

<p>
    <label for="something">Something Since</label>
    <input type="text" id="something" />
    <img src="" style="vertical-align:middle;" />
</p>

http://jsfiddle.net/2nxsQ/

【讨论】：