IE8中的按鈕佈局問題

我的搜索在右側有一個名爲Go的按鈕，它在除IE8之外的所有現代瀏覽器中都處於正確位置（在IE7和IE6中這是一場噩夢，但我不在乎這些瀏覽器）。我嘗試了一些東西，但按鈕不來它在IE8的地方有人可以告訴我，爲什麼會這樣這裏是要表明我的意思 http://content.screencast.com/users/cryoffalcon/folders/Jing/media/92fc0c87-44ac-4c7a-9af5-d8d5824ef85d/go%20button.png IE8中的按鈕佈局問題

這裏是演示頁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; 
}

來源

2012-04-26 CryOfFaclon

從.formbox和.formbutton中刪除頂部和底部頁邊距，並將它們都設置爲vertical-align: top;很大程度上對IE8中的問題進行了排序。如果您需要圍繞它們的垂直空間，則可以使用父母form上的padding（並將其設置爲display: block;）。

（使用conditional classes使得它更容易瞄準IE特有的修復這樣的）

來源

2012-04-26 13:46:26

謝謝我用你的方法對味道進行了微小的改變 – CryOfFaclon 2012-04-26 19:08:34

如果你能提供的按鈕的代碼，這將有助於一個的jsfiddle。 IE開發工具不會與我合作。如果我的記憶服務，請嘗試在兩個輸入字段中添加左邊的浮動，看看會發生什麼。

看看這個網站，並在搜索：這真的類似於這樣做，但有一個額外的div做有彈性的東西：http://www.genesismedicalimaging.com

來源

2012-04-26 13:30:30

我在阿富汗5KBPS速度不要指望我用的jsfiddle：P – CryOfFaclon 2012-04-26 13:41:25

是的jsfiddle真的帶寬密集型？ – 2012-04-26 14:07:57

yes jsfiddle對我來說是一個噩夢：P – CryOfFaclon 2012-04-26 19:08:59

，如果你在你的HTML頭包住你的新創造條件語句這很容易固定如

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

並將下面的CSS放入樣式表中，這應該可以解決問題。

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

你已經有一個條件語句在你的頭上來創建HTML5元素。

任何問題，我很樂意提供幫助。

來源

2012-04-26 13:41:18 frontendzzzguy

我也喜歡你的方法，它也和另一個一樣有用，我只是選擇了其中一種方法，沒有任何困難的感覺，非常感謝你的幫助，我真的很感激。 – CryOfFaclon 2012-04-26 19:09:46

完全沒問題。樂於幫助。 – frontendzzzguy 2012-04-27 08:29:39

IE8中的按鈕佈局問題

回答

相關問題