IE中的CSS對齊方式

嗨，我用一些CSS創建了一個標籤。標籤css運行良好Firefox，Chrome，但是當我在IE中運行時，css不能正常運行。IE中的CSS對齊方式

label.formInputField {width:119px; height:26px; margin:3px 0px 0 0; padding:11px 6px 0 6px; background: #dadada url('css-images/labelBG.png') 50% 50% repeat-x; float:left; display: block; font-size: 12px; font-weight: normal; line-height: 1.1; color:#333; text-align:right; border: 1px solid #AAAAAA; border-right: 1px solid #dadada; } 

.div_form_textbox { width:200px; float:left; text-align:left; background-color:#E6E6E6; height:29px; margin:3px 2px 0 0; padding:5px 0 3px 5px; border-right: 1px solid #AAAAAA;border-top: 1px solid #AAAAAA;border-bottom: 1px solid #AAAAAA; background: #e6e6e6 url('siva_images/form_input_bg.png') 50% 50% repeat-x;} 

.ui-corner-left { -webkit-border-bottom-left-radius :4px;-webkit-border-top-left-radius :4px; border-bottom-left-radius: 4px; border-top-left-radius: 4px; } 
      .ui-corner-right { -webkit-border-bottom-right-radius :4px;-webkit-border-top-right-radius :4px;border-bottom-right-radius: 4px; border-top-right-radius: 4px; } 


<label class ="formInputField ui-corner-left" for="Pdoctor">Doctor First Name:</label> 
<div class="div_form_textbox ui-corner-right"> 
            <input id="fname" name="fname" type="text" size="30" class="textbox ui-corner-all"/> 
           </div>

在Mozilla和Chrome適當的輸出這樣的 enter image description here

所以在IE一樣的東西來了是這樣的：

enter image description here

左邊是標籤和右邊是div裏面有一個文本框。我的問題只有一半來自醫生名字的標籤。請幫我解決這個問題

來源

2011-09-05 Siva

它在我的IE瀏覽器JSFiddle中渲染得很好......你有沒有設置你的文檔類型？ –

是我doctype被設置爲<！DOCTYPE html> – Siva

當我在look at it in Quirks Mode的IE中得到這種確切的行爲。

你可能只需要添加一個有效的doctype作爲第一行，如：

<!DOCTYPE html>

如果你已經有一個，然後有針對的怪癖模式其他可能的原因。

來源

2011-09-05 09:37:20 thirtydot

我給了第一行類似於給出<！DOCTYPE html> – Siva

@Siva的第一行當你說「類似」時，你能準確地告訴我們你的DOCTYPE條目好像？如果它甚至*輕微*錯誤，它可能會引發怪癖模式。這絕對是你網頁的第一行嗎？ –

@Siva：我可以鏈接到你的網頁嗎？這樣，我可以很快找到問題。 – thirtydot

IE8及更少瀏覽器無法呈現CSS3 -webkit命令。就像你在css風格中使用的那樣：

.ui-corner-left { -webkit-border-bottom-left-radius :4px;....

來源

2011-09-05 10:34:01

實際上沒有IE瀏覽器會呈現'-webkit' CSS，因爲它不是一個webkit瀏覽器。然而，這並沒有解決OP所具有的問題，因爲文檔是以怪癖模式呈現的。 – anothershrubery

IE中的CSS對齊方式

回答

相關問題