0

以下のコードでは、TextBox フィールドは の幅と高さに適合する必要がありますdiv#chat-message(ギャップは2px)。これは、Chrome では完璧に見えますが、IE8 や Mozilla ではそうではありません。Mozilla では、TextBox フィールドのサイズも変更できますが、これは望ましくありません。

HTML

<!-- Nested in Div's -->
 <div id="chat-message-outline">
    <div id="chat-message">
        <asp:TextBox ID="txtmsg" BackColor="Transparent" runat="server"
                  Wrap="true" BorderStyle="None" TextMode="MultiLine" />
    </div>
 </div>

CSS

#chat-message-outline
{
  height: 20%;
  width: 100%;
  background-color: #D1D1D1;
  position: relative;
}

#chat-message, #txtmsg
{
  padding: 0;
  top: 2px;
  bottom: 2px;
  right: 2px;
  left: 2px;
  background-color: white;
  position: absolute;
  resize: none; /* CSS3 property */
}

このコードをクロスブラウザにするのを手伝ってください..

2px編集: TextBox フィールドと親 div の間にギャップが必要なため、パーセンテージを使用できません。

questionPS：クロスブラウザではない回答を得た前にこれを尋ねました（後で実現しました）

4

1 に答える 1

1

を使用してテキストエリアを別の要素に合わせる方法の解決策position:absolute: http://snook.ca/archives/html_and_css/absolute-position-textarea

フィドル: http://jsfiddle.net/bQQYA/ 編集: 2px 間隔のフィドル: http://jsfiddle.net/3EPSL/

また、同様の質問を見つけました: 100% TextArea in FireFox using absolute position

于 2012-11-28T09:45:51.297 に答える