IE7沒有在絕對定位的表格中居中嵌入輸入

在IE7中運行時（特別是在兼容性視圖中，IE8嚴重失敗）頁面出現特有故障。當我使用XP模式（以及其他一些錯誤）時，IE6會出現類似的錯誤，但我並不太擔心IE6的兼容性。IE7沒有在絕對定位的表格中居中嵌入輸入

即，輸入框左對齊時，它應該居中作爲內聯元素。相關CSS：

form#prompt { 
    position: absolute; 
    height: 300px; 
    width: 600px; 
    margin: -150px 0 0 -300px; 
    top: 50%; 
    left: 50%; 
    text-align: center; 
} 

input#password { 
    margin: 10px auto; 
    padding: 5px 10px; 
    text-align: center; 
    width: 398px; 
    display: inline; 
}

相關HTML：

<form id="prompt"> 
    <input type="text" name="password" id="password" /> 
</form>

現在真正奇怪的事情是，當你觸發形式，它返回false並初始化回調$('#prompt_output').text(' ').css('opacity',0).text('Access granted. Loading...').fadeTo(200,1);上提交監聽器，一切正常。輸入權限本身。事實上，即使回調只是$('#prompt_output').text(' ')，它也可以工作。只需選擇元素$('#prompt_output');不會執行任何操作。

任何幫助，將不勝感激。

來源

2009-11-26 Steven Xu

該鏈接需要輸入密碼 – carillonator 2009-11-26 05:17:01

可接受的密碼是'password'，但您可以輸入任何內容以觸發表單提交偵聽器以用於我的描述。 – 2009-11-26 08:03:58

沒有徹底改變CSS /標記我認爲這解決了ie7中的問題（未在ie6中測試）。

嘗試在輸入周圍包裝標籤 - 我不知道爲什麼它的工作原理，我只測試ie7，ie8和Firefox，但它似乎是做的伎倆。

<label for="password" class="instruction"> 
    Access restricted: enter password 
    <br> 
    <input name="password" id="password" type="text"> 
</label>

來源

2009-11-26 16:55:24 Mark

儘管將'input'標籤作爲'label'的子標籤幾乎肯定不是標準的，這個修補程序似乎可以在IE7和IE6中使用。 – 2009-11-26 22:53:51

其實我認爲包裝輸入是完全有效的。不知道有關
。 – Mark 2009-11-27 07:50:50

我已經運行你的頁面通過an emulator，這顯然是一個IE7和以前的版本的問題。它適用於FF和IE8。但我認爲你已經知道了。

我建議你做一個快速的&髒修復 - 通過在<body>上加載onload來運行$('#prompt_output').text(' ')，只是爲了設置事情。當您有時間研究IE6/7錯誤時，我建議您嘗試更改佈局，因爲我認爲IE不知道如何正確解釋您的CSS。

來源

2009-11-26 14:40:26 Nir

IE7沒有在絕對定位的表格中居中嵌入輸入

回答

相關問題