0

ここに小さな HTML があります。

<html>
<body>
    <div id="containerDiv" style="background-color:red; height: 200px">
        <div id="topDiv" style="background-color:green">
            <input type="button">1</input>
        <div>
        <div id="textAreaDiv" style="background-color:blue;width:100%; height:100%;">
            <textarea style="width:100%; height:100%;">123</textarea>
        </div>
        <div id="bottomDiv" style="background-color:purple">
            <input type="radio" name="Milk" value="Milk">Milk</input>
            <input type="radio" name="Butter" value="Butter">Butter</input>
        </div>
    </div>
</body>
</html>

textAreaDiv.height を containerDiv.height - (topDiv.height + bottomDiv.height) にするために私がやろうとしていること。これは Chrome では完全に機能しますが、IE9 では機能しません。IE9 では、テキストエリアの高さは約 2 文字の高さです。これをChromeと同じようにIE9で動作させる方法はありますか?

ここに私が得ているもののスクリーンキャップがあります: http://postimage.org/image/bfn6bsalv/

更新 これはjavascriptを使用したソリューションですが、純粋なCSSソリューションが必要です

<html>
<head>
    <script type="text/javascript" src="JQuery-1.7.2.min.js"></script>
</head>
<body>
    <script>
        $(document).ready(function() {          
            var textHeight = $('#containerDiv').height() - ($('#topDiv').height() + $('#bottomDiv').height());          
            $('#textBox').height(textHeight);
        });
    </script>
    <div id="containerDiv" style="background-color:red; height: 400px">
        <div id="topDiv" style="background-color:green;height:25px;">
            <input type="button">1</input>
        </div>
        <div id="textAreaDiv" style="background-color:blue;width:100%;">            
            <textarea id="textBox" style="width:100%;">123</textarea>           
        </div>
        <div id="bottomDiv" style="background-color:purple;height:25px;">
            <input type="radio" name="Milk" value="Milk">Milk</input>
            <input type="radio" name="Butter" value="Butter">Butter</input>
        </div>
    </div>
</body>
</html>
4

1 に答える 1

0

うまくいったものを見つけてくれてうれしいです。なぜうまくいかなかったのかをお知らせしたいと思います。コードが無効です。の終了タグにtopdivスラッシュがありません。

于 2013-01-17T16:25:09.033 に答える