页面显示在大多数浏览器中正确，但在 Safari 中不正确答案

【问题标题】：Page display correct in most of browser but not Safari页面显示在大多数浏览器中正确，但在 Safari 中不正确
【发布时间】：2014-01-06 05:21:33
【问题描述】：

我的 CSS 格式在 Firefox、Chrome 和 Opera 上运行良好，但在 Safari 浏览器上出现问题。我尝试了一些我在网上找到的方法，但没有任何效果。我最需要的是让文本输入的垂直边框与带有文本的框处于同一垂直线：“napisz do nas”和多行框的下部按钮宽度与在 Firefox 上看起来一样

Screen from Firefox

Screen from Safari

这是 CSS 代码：

.button{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:140px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.button1{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:100px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.clean{
cursor:pointer;
margin-bottom: 5px;
background-color:#ECECFF;
color:#000000;
width:73px;
padding:2px;
text-align:center;
font-weight:bold;
/*/*/border:1px solid #000000;/* */
}
.box{
border:1px solid #C0C0C0;
Width=250px;
}
.margin{
margin-right:50px;
}

还有 HTML：

<div align="center"><button class="button">Napisz do nas</button></div>
        <div>
<form runat="server">
                <div align="center" class="margin">
                <table border="0" width="350">
                    <tr>
                        <td valign="top"><font face="Verdana" size="2">Imi&#281; i Nazwisko:</font></td>
                        <td height="20">   <asp:TextBox  class="box" runat="server" Height="21px" ID="txtName"></asp:TextBox>
                        <br>
                        <asp:RequiredFieldValidator ID = "req1" ControlToValidate = "txtFrom" Runat = "server" ErrorMessage = "Prosz&#281; poda&#263; Imi&#281; i Nazwisko "></asp:RequiredFieldValidator></td>
                    </tr>
                    <tr>
                        <td valign="top"><font face="Verdana" size="2">E-mail:</font></td>
                        <td height="24"> <asp:TextBox class="box" runat="server" Height="22px" ID="txtFrom"></asp:TextBox>
                        <br>
                        <asp:RegularExpressionValidator ID = "reg1" ControlToValidate = "txtFrom" Runat = "server" ErrorMessage = "Invalid Email" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*"></asp:RegularExpressionValidator>&nbsp;<asp:RequiredFieldValidator ID = "req3" ControlToValidate = "txtFrom" Runat = "server" ErrorMessage = "Nieprawid&#322;owy Email" ></asp:RequiredFieldValidator></td>
                    </tr>
                    <tr>
                        <td valign="top"><font face="Verdana" size="2">Wiadomo&#347;&#263;:</font></td>
                        <td  height="80"> <asp:TextBox class="box" runat="server" Height="80px" TextMode="Multiline" rows="4" ID="txtComments"></asp:TextBox>
                        </td>
                    </tr>
                    <tr>
                        <td valign="top"></td>
                        <td colspan="2" valign="top" height="10" width="20">
            <asp:Button class="button1" Runat = server ID = btnSubmit OnClick = btnSubmit_Click Text = "Wy&#347;lij"></asp:Button>
                        &nbsp;<input  type = "reset" class="clean" runat = "server" value = "Wyczy&#347;&#263;"></td>
                    </tr>
                    </table>
                </div>
</form>
                </div>

【问题讨论】：

标签： html css macos safari

【解决方案1】：

您可以在网页中使用 Normalize.css。会有帮助的。

将以下内容添加到您的脑海中

<link rel="stylesheet" src="//normalize-css.googlecode.com/svn/trunk/normalize.css" />

【讨论】：

【解决方案2】：

如何将按钮定位到表格中？像这样：

<table border="0" width="350">
    <tr>
        <td></td>
        <td><button class="button">Napisz do nas</button></td>
    </tr>
    <tr>
        <td valign="top"><font face="Verdana" size="2">Imi&#281; i Nazwisko:</font></td>
        <td height="20" align="left">  <asp:TextBox  class="box" runat="server" Height="21px" ID="txtName"></asp:TextBox>
                    <br>
                    <asp:RequiredFieldValidator ID = "req1" ControlToValidate = "txtFrom" Runat = "server" ErrorMessage = "Prosz&#281; poda&#263; Imi&#281; i Nazwisko "></asp:RequiredFieldValidator></td>
    </tr>
<!-- ... -->
</table>

另一种可能性，给左列一个固定的宽度，给按钮一个具有这个宽度的左边距。

【讨论】：