0

我在右侧的搜索有一个名为 Go 的按钮,它在除 IE8 之外的所有现代浏览器中都位于正确的位置(在 IE7 和 IE6 中,这是一场噩梦,但我不关心那些浏览器)。我尝试了一些东西,但是按钮在 IE8 中没有到位,有人可以告诉我为什么会这样,所以这里有一张图片来说明我的意思 http://content.screencast.com/users/cryoffalcon/folders/Jing /media/92fc0c87-44ac-4c7a-9af5-d8d5824ef85d/go%20button.png

这是演示页面http://bloghutsbeta.blogspot.com/2012/03/testing-3.html 如果你不想在这里寻找 css 是 css:

.formbox {
background:#434445;
border-top-color:#0f0f0f;
border-top-style:solid;
border-top-width:3px;
border-left-color:#0f0f0f;
border-left-style:solid;
border-left-width:3px;
border-right-color:#797d7d;
border-right-style:solid;
border-right-width:3px;
border-bottom-color:#797d7d;
border-bottom-style:solid;
border-bottom-width:3px;
-webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
color:#787D7D;
font:13px Verdana,Geneva,sans-serif;
margin: 3px 0 5px 5px;
padding:1px;
}
.formbutton {
margin:0 5px 5px 0;
color:#B6E85E;
text-shadow: 0 0 4px #7F241C, 0 0 4px #7F241C,
        0 0 4px #7F241C;
cursor:pointer;
}
4

3 回答 3

2

如果您在 html 头中创建一个条件语句来包装您的新样式表,这很容易解决,例如

<!--[if IE 8]><link rel="stylesheet" href="Css/ie.css" /><![endif]-->

并将以下 CSS 放入您的样式表中,这应该可以解决问题。

input.formbutton.buttonbloghuts.buttongradient {
position: relative;
top: 8px;
}

您的脑海中已经有了一个条件语句来创建您的 HTML5 元素。

有任何问题,我很乐意提供帮助。

于 2012-04-26T13:41:18.970 回答
1

.formbox从和中删除顶部和底部边距.formbutton,并将它们都设置为vertical-align: top;很大程度上解决了 IE8 中的问题。如果您需要它们周围的垂直空间,您可以padding在父级上移动 use form(并使其成为display: block;)。

(使用条件类可以更轻松地针对此类针对 IE 的特定修复)

于 2012-04-26T13:46:26.663 回答
0

如果您可以提供一个按钮代码的 jsfiddle 会有所帮助。IE 开发工具不太愿意与我合作。如果我没记错的话,请尝试在两个输入字段上添加左浮动,看看会发生什么。

看看这个网站和搜索:它真的很相似,但是有一个额外的 div 来做有弹性的东西:http ://www.genesismedicalimaging.com

于 2012-04-26T13:30:30.487 回答