Question

在my website 的主页上，我对页面右上角的两个输入有疑问（“Rechercher”文本字段和“OK”按钮）。
事实上，我的CSS适用于FF＆amp; IE但不在Chrome上。
为了使它更通用，它只是div中的两个输入你能帮我纠正Chrome上的这种不当行为吗？

非常感谢！

“Rechercher”文本字段的CSS：

 #champ_recherche_style {
height:14px;
margin-bottom:15px;
margin-top:15px;
width:150px;
}

“确定”按钮的CSS：

 #habillage_bouton_texte_recherche_style {
background-color:#8C8C8C;
color:#FFFFFF;
display:inline;
font-family:Verdana;
font-size:11px;
font-weight:bold;
margin:15px 1px 0 10px;
padding:0 3px;
text-decoration:none;
vertical-align:top;
}

div的CSS：

 #encart_recherche_style {
padding-left:746px;
text-align:center;
width:210px;
}

Answer 1

一般来说，表格布局很糟糕，但是如果你必须使用它们，只需在输入的TD之后将按钮放在TD中，而不是将输入字段单独放在表格中并尝试强制表格显示内联

我强烈建议您在将来学习如何使用CSS进行布局。

同样，我不推荐用于布局的表格，但是......

代替：

<table>
    <tr>
        <td> INPUT IS HERE </td>
    </tr>
</table>
BUTTON IS HERE

试试这个：

<table>
    <tr>
        <td> INPUT GOES HERE </td>
        <td> BUTTON GOES HERE </td>
    </tr>
</table>

Answer 2

在您的桌面上使用内联块而不是内联将使您更接近您想要的行为。

Chrome - 输入在div中对齐（适用于FF＆amp; IE）

2 个答案: