1

クロスブラウザソリューションで input="text" ボックスの幅を自動調整することは可能ですか? 以下の例では、テキストボックスの幅を調整して、「テキスト」テキストに達するようにします。これに対する crossbroswer-solution はありますか (IE6 以降)?

jsfiddle: http://jsfiddle.net/P4Qd8/1/

HTML

<div id="wrapper">
    <div id="left">Label</div> 
    <div id="right">Text</div>
    <div id="middle">
        <input id="info" input type="text">
    </div>   
</div>

そしてCSS

#wrapper{height: 100px; width: 350px; border: 1px solid blue;}

#left{float:left;}
#middle{float:left;}
#right{float:right;}

#info{width: 100%;}

御時間ありがとうございます！

4

2 に答える 2

0

あなたの質問にはJQueryタグが付いているので、例を示しましょう。JQueryを使用してIEで幅を設定できます.IE6ではテストしていませんが（私は気にしませんし、同じことをする必要があります）、それはJSであり、動作するはずです。これは IE でのみロードでき、CSS で要素を操作できます。

$(document).ready(function(){
    var width = $('#middle').width();
    var padding = $('#middle input').css('padding').replace('px','');//the padding defined in css
    var border = $('#middle input').css('border-width').replace('px','');//the border width
    $('#middle input').css('width', width-padding-border*2);
});

width: 100%これについては、IE では動作するはずなのに動作しないとあなたが言う理由が本当にわかりません。

編集: JSFiddle: http://jsfiddle.net/P4Qd8/4/

于 2013-07-12T23:15:52.350 に答える