這段時(shí)間在處理網(wǎng)頁(yè)默認(rèn)的input 按鈕時(shí)，IE下常顯現(xiàn)不一致的寬度問(wèn)題，讓人感到很糾結(jié)。所以今天請(qǐng)教了幾位高手把這個(gè)問(wèn)題解決了，現(xiàn)在貼出來(lái)和大家共享一下，當(dāng)然這個(gè)方法在網(wǎng)上曾有人寫(xiě)過(guò)，大家可以一起來(lái)相互探討一下。
Html Code:
CSS Code:
從上圖中我們明顯可以看出，只有在Firefox下顯示才是正常，在IE7和IE下沒(méi)有圓角效果，這個(gè)都是眾所周知，但I(xiàn)E7具有一個(gè)致命的問(wèn)題，就是寬度變長(zhǎng)了，大家一定會(huì)感到奇怪，我們沒(méi)有定寬度的呀，怎么會(huì)這樣呢？呆會(huì)我們會(huì)引用別人的說(shuō)法了說(shuō)明這個(gè)問(wèn)題；另外就是Safari和Chrome下高度怎么也不行的呀。
就是因?yàn)檫@樣的問(wèn)題，我糾結(jié)了一個(gè)下午，但在高人的指點(diǎn)下，還是找到了相關(guān)的解決辦法，現(xiàn)在我們一起來(lái)看看高人是如何解決這樣的兼容問(wèn)題。在IE7下會(huì)隨著文字的增加導(dǎo)致文本距離按鈕左右兩側(cè)的間距越來(lái)越大，這樣就導(dǎo)致了上圖中所看到的效果，但該問(wèn)題存在于IE6/IE7，F(xiàn)F、IE8以及Opera 10沒(méi)發(fā)現(xiàn)類(lèi)似問(wèn)題。對(duì)于另一情況，小生至今還沒(méi)有弄明白為什么在Safari和Chrome下會(huì)出現(xiàn)高度問(wèn)題，還希望各位前輩和高手指點(diǎn)。
針對(duì)前面的Bug，我對(duì)我的CSS稍加做了修改，如下：
