0

右側にボタンがあるページに Select2 要素があり、Select2 がボタンが占めるスペース以外のすべてのスペースを占めるようにします。問題は、Select2 がアクティブになると独自の書式設定を挿入することであり、これを回避する方法がわかりません。

ここに私が持っているものがあります:

<ul style="width:100%">
 <li>
  <label style="display:inline">From: </label>
  <div class="select2-container select2-container-multi test" style="width:0px">
  <ul class="select2-choices">...

select2-choices を最初の ul の 90% にしたいのですが、

.test .select2-choices {
    width:90%;
}

次に、0pxである以前のdivの90％が得られます。親divからではなく、最初のulから「select2-choices」の幅を取得する方法はありますか?

4

1 に答える 1

0

CSSではありません。そのためには、JavaScript を使用する必要があります。親の幅を 0px にする必要がある特定の理由はありますか?

編集：jQueryでこのようなことができます。パーセンテージをハードコーディングすることはお勧めしませんが、これでうまくいくはずです。

$(document).ready(function(){
    $(window).on('resize',function(){
       var $choices = $('.select2-choices');
       var parentWidth = $choices.parents('ul').width();
       $choices.width(parentWidth*.9);        
    }).trigger('resize');
});

http://jsfiddle.net/BAGkD/

于 2013-09-16T19:22:38.233 に答える