IE的兼容性與形式的CSS樣式

的源代碼是這樣的：IE的兼容性與形式的CSS樣式

<div id="contact"> 
       <div class="form"> 
        <form action="contact.php" method="post" name="contact-us"> 
         <div class="right"> 
          <div class="labeled"> 
           <label for="text">body</label> 
          </div> 
          <textarea id="text" name="text" cols="20" rows="5"></textarea> 
         </div> 
        </form> 
       </div> 
      </div>

這是對文本區域和相關對象的CSS塊：

div.right { 
float: right; 
margin: 5px 0; 
} 

div.labeled { 
width: 150px; 
float: right; 
} 

div.right div.form textarea#text, textarea#text { 
background: #A2A2A2; 
border: 1px solid #811D1D; 
height: 50px; 
margin-right: 20px; 
width: 220px; 
color: #FFFFFF; 
font-family: Tahoma, Geneva, sans-serif; 
font-size: 11px; 
}

在FF的所有事情都是正確的，但在IE瀏覽器該textarea尚未被設計，並保持完整。您可以在下面的圖片查看相差太大：

defference between IE and FF

而且你可以看到在FF風格的真實標籤標識，在IE保持不變！我該如何解決這些問題？

問候......

來源

2011-03-14 DummyBeginner

不是IE瀏覽器的所有版本都支持這一點。你正在使用哪個版本？不過你確實設法將滾動條放到左邊。 :) – GolezTrol 2011-03-14 00:47:43

我試過在IE 7,8,9 – DummyBeginner 2011-03-14 00:57:43

解決了！只是有在頁面的頭部這個CSS塊：

div.form input[type="submit] { 
padding: 2px; 
background: #A2A2A2; 
border: 1px solid #811D1D; 
color: #000000; 
height: 20px; 
}

，當你看到有一個失去了引號的[類型=「提交」]。 IE瀏覽器無法更正代碼，但其他瀏覽器可以這麼做！這是問題

P.S：特別感謝@Bakudan引入jsfiddle Online Editor

問候......

來源

2011-03-14 02:11:05 DummyBeginner

不是IE瀏覽器的所有版本都支持textarea的造型。

在你的代碼中，textarea在浮動的div內。好像你在問奇怪的行爲。更好地浮動「標籤」div（或者更確切地說，刪除該div並在標籤本身上做一些欺騙）。

來源

2011-03-14 00:50:22 GolezTrol

你的意思是我應該使用texearea裸體而不是在DIV內？ – DummyBeginner 2011-03-14 01:54:29

不一定，儘管你可以。我的意思是你應該漂浮'標記'的div而不是'正確'的div。爲了取得成功，你應該把textarea放在一個新的div中，或者你應該在textarea中添加樣式「display：block」，使它看起來像塊元素（div是）。 – GolezTrol 2011-03-14 09:28:39

http://jsfiddle.net/KzYgt/

overflow: auto; - 爲滾動條

來源

2011-03-14 00:52:53 Bakudan

在這個CSS選擇器中不起作用。我不知道爲什麼 – DummyBeginner 2011-03-14 01:14:38

http://img828.imageshack.us/img828/4557/ieoverflow.png – Bakudan 2011-03-14 01:19:48

哈哈我剛剛意識到，textarea在CSS上沒有任何文本類型輸入時被稱爲true。（如：）。真是太好笑了！ – DummyBeginner 2011-03-14 01:45:43

樣式表單元素是一個嚴重的地獄，因爲大多數控件由操作系統和瀏覽器的風格，這些風格是很難覆蓋，在某些情況下是不可能的。但是，您應該能夠實現背景顏色和滾動條消失。

你確定在你的頁面上沒有其他元素的id爲「text」嗎？

什麼是可能與CSS的textarea的造型一個很好的概述可以在這裏找到：http://www.456bereastreet.com/lab/styling-form-controls-revisited/text-input-multiple/#ie6-xp

來源

2011-03-14 00:55:24 ChrisR

在頁面上也有一些輸入標籤類型爲「文本」，但文本ID是唯一的。謝謝，我會檢查你的鏈接 – DummyBeginner 2011-03-14 01:53:14

IE的兼容性與形式的CSS樣式

回答

相關問題