Question

我遇到了css和FF3 / IE7以及Opera 10的问题。

我有一个输入[type =“submit”]和一个锚点，我想要将它们设置为相同的样式。无论我尝试什么，唯一的逻辑浏览器似乎是Opera 10（它使用相同的CSS对它们进行相同的样式）。

FF似乎有不同的填充（我需要在填充中使提交框1px更小以适应但是这会使Opera 10关闭）并且IE7只是关闭。

代码爱好者的代码：

<form action="/login" method="post" id="loginform">
    <fieldset>
        <input type="submit" value="Login" />
        <a href="/register">Register</a>
        <a href="/reminder">Lost Password?</a>
</fieldset>
</form>

的CSS：

fieldset a {
    color: #ffcc00;
    border: 1px solid #707070;
    background: #000000;
    font-size: 10px;
    font-weight: normal;
    padding: 2px;
    /*vertical-align: text-top;*/
}
fieldset a:hover {
    color: #ffcc00;
    border: 1px solid #707070;
    background: #333333;
    cursor: pointer;
    font-size: 10px;
    font-weight: normal;
    text-decoration: none;
    padding: 2px;
}
fieldset input[type="submit"] {
    color: #ffcc00;
    padding: 2px;
    border: 1px solid #707070;
    background: #000000;
    font-size: 10px;
    font-weight: normal;    
}
fieldset input[type="submit"]:hover {
    color: #ffcc00;
    padding: 2px;
    border: 1px solid #707070;
    background: #333333;
    cursor: pointer;
    font-size: 10px;
    font-weight: normal;
}

任何有助于解决浏览器之间对齐问题的帮助都是理想的，因为我需要支持所有三个（Safari也是如此，但我认为如果我将这三个对齐它也应该在那里工作）。

非常感谢（p.s我现在正在吃午餐，并且会在事先得到缓慢回复的同意之后检查答案）

Answer 1

Firefox问题就像这样解决了

button::-moz-focus-inner { 
  border: 0;
  padding: 0;
}

Answer 2

单独试试。我建议使用reset.css文件强制所有浏览器将苹果视为苹果，然后相应地设置INPUT和A元素的样式。

其他CSS规则可能会混合使用。

请参阅http://meyerweb.com/eric/tools/css/reset/了解重置文件。

我在使用IE时遇到过问题，并设计了某些元素（特别是禁用元素），以及IE在版本6和版本7之间处理这种样式的方式有何不同。

以下DOCTYPE似乎在这些情况下有所帮助，但IE 6中的渲染可能不再按预期工作：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

输入和浏览器之间的锚点问题

2 个答案: