CSS问题：IE图像按钮未正确对齐

Question

Firefox正确显示红色“搜索列表”按钮与文本输入字段内联。

但是，IE 6/7未对齐。

为什么IE在页面上显示的红色按钮比其他浏览器更低？

IE 8的截图（正确）
api.browsershots.org/png/original/54/546946b7cfd67ce2c59de0b608c3323.png

IE 7的屏幕截图（不正确）
api.browsershots.org/png/original/52/52c54c02fb6803584e77223309df99b.png

Answer 1

这是因为你是浮动按钮而不是文本框。将float：left添加到＃city-field

Answer 2

哇他们看起来几乎和我的眼睛一模一样。您是否尝试在输入按钮上将边距设置为0？

编辑：好的，没关系。根据您的IE8屏幕截图，它在我的Firefox中无法正确显示。

Answer 3

IE的宽度和浮点数众所周知。两个元素似乎都定义了宽度。我实际上看到它们在IE7中很好地对齐。

将 float：left 添加到＃city-field可以解决您的问题 - 浮动元素有时会被处理为与非浮动元素不同。