html - IE下CSS/HTML::对齐和按钮问题

Question

我在使用 IE 浏览时，这个页面出现了一个奇怪的错误 http://www.emfx.fr/?page_id=38

这张图片清楚地解释了问题: http://appartager.free.fr/site/bugIE.jpg

• 当我用 IE 在本地(easyPHP)查看此页面时，一切正常
• 当我用 IE 在线查看此页面时，我遇到了 2 个问题 1) 我的 hr 标签没有居中对齐 2) 按钮发送消息被裁剪

但是代码完全相同并且浏览器相同 (IE)

hr 行为在 css 文件中控制

hr.center {
    border: none;
    color: #353a40;
    background-color: #353a40;
    height: 1px;
    width: 371px;
    text-align: center;
}

按钮也由 2 个 css 文件控制(所有浏览器/IE 异常(exception))

这是通用代码:

#contact_form input[type=submit] {
padding: 7px 15px;
background: rgba(255,255,255,0.1);
border-radius: 3px;
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
font-family: "Droid Sans", Arial;
cursor: pointer;
border: 1px solid #666;
color: #ccc;
margin-bottom: 10px;
margin-left: 420px;
} 

这是 ie 异常(exception)

#contact_form input[type=submit] {
    padding: 8px 0px;
    background: rgba(255,255,255,0.1);
    margin-bottom: 300px;
    margin-left: 418px;
    text-align: center;
}

如果你们知道如何解决这个问题，那就太好了!

干杯!

问

Answer 1

您已经从 IE 中的按钮中删除了水平填充

#contact_form input[type=submit] {
    padding: 8px 0px; /* 15px?*/

我个人会使用 margin:auto 而不是使用 text-align 将 hr 居中 - 但是 hr 默认居中对齐；所以你不需要调整它。

(在 IE 网络开发人员工具中删除这些声明似乎可以解决问题)。