2017-12-21 7 views
-1

私はbootstrap-selectを使用しており、自分のページにドロップダウン選択があります。問題は、クリックするとドロップダウンリストが表示されますが、領域に収まらず、計算され、スクロールが領域の下を流れます。これは、次のようになります。このためブートストラップ選択スクロールが外に出る

pic

HTML:

<form role="form" id="condition_form_check" method="post" class="form-horizontal condition_form"> 
       <div class="form-group"> 
        <label class="col-xs-3 control-label">Check</label> 
        <div class="col-md-8"> 
         <div class="btn-group bootstrap-select form-control"> 
          <select id="has_id" name="has_id" size="1" class="form-control" data-live-search="true" title="select check..." tabindex="-98"> 
           <option value="1">check_1</option> 
           <option value="2">check_2</option> 
           <option value="3">check_3</option>//etc... 
          </select> 
         </div> 
        </div> 
       </div> 
      </form> 

問題は、時にはそれがこのバグで、いくつかの回をOKに見えるということです。 (1057年頃)、次のソース行から(おそらく)行く

max-height:255px; 
overflow-y: auto; 

:いくつかの研究の後、私はいくつかのインラインCSSスタイルがselectタグに適用されていることが判明

$menuInner.css({ 
     'max-height': menuHeight - menuPadding.vert + 'px', 
     'overflow-y': 'auto', 
     'min-height': '' 
    }); 

しかし、私は知りませんこの問題を解決する方法。どんなアイデアも歓迎されます、ありがとう。

答えて

0

あなたのcss.Likely

.form-control{ 
    height:auto; 
} 

し、また、最大高さは `.FORM-control`と100%

form-control{ 
    height:auto; 
    max-height:100%; 
} 
select{ 
    height:auto; 
    max-height:100%; 
} 
+0

あるセットにフォームコントロールの高さ値 "auto" を設定する必要がありますCSSスタイルのスクロールバーが正しく表示されず、下矢印が消えてリストがその領域の面積に収まらない。 – Masha

関連する問題