輸入元素的佈局在IE8中被壓扁

Question

想知道是否有人可以幫助解決IE8問題，我搜索了高低，並嘗試了許多不同的東西。在一個用於客戶端的WordPress網站上，與我測試過的所有其他瀏覽器相比，輸入文本框比它應該顯示得小得多，並且在頁面的旁邊。

你可以看到的頁面的外觀上的IE8（在Windows 7）這裏搶： http://perfectitaliano3.fonterra.safecom.com.au/wp-content/uploads/grab2.jpg

如果你比較，爲頁面http://perfectitaliano3.fonterra.safecom.com.au/recipe/potato-rosemary-and-speck-pizza/在現代瀏覽器中，你會看到的寬度和位置右上角的搜索框和過濾器下拉菜單都搞亂了。

我在IE8問題上有點小氣，但我試過改變CSS，用modern.js，html5 shiv，modernizr，各種各樣的東西修補它，但沒有任何區別！

如果您有任何建議，請讓我知道，謝謝。

Answer 1

試試這個

#top #s{ 
    height: 40px; 
    padding: 0px 47px 0px 5px; 
} 

Answer 2

非常感謝回答@Jenti。我嘗試了你的建議，但它似乎並沒有工作，雖然因爲它現在活着，我試圖在IE8的虛擬機版本的開發人員工具中，所以人們永遠無法確定;）

但是，找到了一個解決方案，我添加了以下內容：

#searchform > div { 
    width: 500px; 
} 
#s { 
    display: table-cell !important; 
} 

而且似乎這樣做。再次感謝並感謝。