Chrome 和 IE 中的按钮区别答案

【问题标题】：Button difference in Chrome and IEChrome 和 IE 中的按钮区别
【发布时间】：2012-11-01 15:26:37
【问题描述】：

所以我有一个网站 - 在输入客户/保存客户我有一些按钮 - 它们在 IE 9 中正确显示，但在 Chrome 中不正确（功能在两者中都可以正常工作） - 它只是为了我想要的外观它看起来都很好。

这就是它的外观（IE 9）

这就是它在 Chrome 中的样子（不正确）

我一直在下面的源代码中尝试不同的东西 - 但是 havenet 让它在 Chrome 和 IE 中都可以工作，所以也许有人能发现我缺少的东西。

                        <div class="PanelPadd" style="margin-top: 10px; text-align: right; padding: 5px; height:25px;">
                            <div id="Div8" style="text-align: right; float: right;">
                                <table>
                                    <tr>
                                        <td valign="middle" style="padding-right: 5px;">
                                            <a id="FindCorrAddress" href="javascript:pageSMCustomerCreate.doRequest(2)">Find Addresses</a></td>
                                        <td valign="middle" style="padding-right: 5px;">
                                            <a id="ClearCAddress" href="javascript:pageSMCustomerCreate.doClearCAddress()">Clear</a></td>
                                        <td valign="middle" style="padding-right: 5px;">
                                            <asp:ImageButton ID="ImageButton4" ImageUrl="./images/buttons/SaveCustomer.gif" runat="server"
                                                OnClick="OnSaveCustomer" /></td>
                                    </tr>
                                </table>
                            </div>
                        </div>

在任何具有类 PanelPadd 的样式表中都没有什么特别之处 - 设置了背景颜色并设置了边框，如下所示。

.PanelPadd    { background-color:#EFEFEF; border:solid #AAAAAA 1px; }

【问题讨论】：

标签： html internet-explorer google-chrome internet-explorer-9

【解决方案1】：

您没有显示足够的样式代码来分析问题。但我假设您正在为FindCorrAddress 和ClearCAddress 设置一定的宽度。

由于最小的字体渲染差异、舍入误差，甚至可能是盒子模型的差异（您是否在兼容性视图中运行 IE9？），适合一个浏览器的特定宽度可能不适合另一个浏览器。

最好的办法是完全不设置宽度，让内容流动，自己定义容器的宽度。

另外，请删除<table>。用表格排版是很不好的风格，自找麻烦。

【讨论】：