jQuery UI的按鈕中的一些問題IE7

Question

我使用jQuery UI按鈕：

$(document).ready(function() { 
    $("a.button, .button, button, input:submit, input:button").button(); 
}) 

<p> 
    <button type="submit" value="Back">Back</button> &nbsp;&nbsp;<a class="button" id="register">Continue</a> 
</p> 

在所有的瀏覽器的按鈕尋找完美的一樣，但是當我檢查IE7（從IE9切換到兼容模式）的Back按鈕有黑色的邊框和Continue按鈕向下移動了幾個像素。

這裏是jsfiddler鏈接http://jsfiddle.net/XJRVt/7/

我也看了IETester它是如何尋找在IE6和它在尋找同樣喜歡在IE7 :(

可能有人會知道如何解決這個問題？

Answer 1

看起來似乎becasue IE6/IE7使用不同的標準樣式元素設定，如果你使用一個CSS復位或CSS正常化框架:)

使用Normalize.css（試過HTTPS會proberbly工作：// github上.COM /necolas/normalize.css/），它至少解決了float問題。

所以它沒有Jquery UI弄亂了佈局，IE！

嘗試插入這樣的：

button, input, select, textarea { font-size: 100%; margin: 0; vertical-align: baseline; *vertical-align: middle; } 
/* 
* 1. Define line-height as normal to match FF3/4 (set using !important in the UA stylesheet) 
* 2. Correct inner spacing displayed oddly in IE6/7 
*/ 
button, input { line-height: normal; *overflow: visible; } 
/* 
* Reintroduce inner spacing in 'table' to avoid overlap and whitespace issues in IE6/7 
*/ 
table button, table input { *overflow: auto; }