web-dev-qa-db-ja.com

セマンティックUIドロップダウンの幅を設定する方法

セマンティックUI検索の選択ドロップダウンの幅を設定するにはどうすればよいですか?セマンティックUI検索の選択ドロップダウンの幅をドロップダウンの最も長い要素に設定する必要があります。どんな助けでもありがたいです。

10
Angular-User

固定サイズのラッパーを、その中にネストされた流体(親のサイズに合わせて拡張)ドロップダウンと組み合わせて使用​​しました

<div style="width: 250px;">
  <div class="ui fluid dropdown">
    <input type="hidden" name="country">
    <div class="default text">My Dropdown Text</div>
  </div>
</div>
7
bjornl

幅を設定する代わりに、最小幅を設定してみてください。デフォルトは14emの最小幅であるため、幅を狭くしたい場合は、これをオーバーライドする必要があります。

3
Alex Gausman

以下に示すように、「compact」属性を使用してみてください。ただし、選択した内容に基づいて幅を調整するだけです。

<div class="ui compact selection dropdown">
  <i class="dropdown icon"></i>
  <div class="text">Compact</div>
  <div class="menu">
    <div class="item">A</div>
    <div class="item">B</div>
    <div class="item">C</div>
  </div>
</div>
0
AUHReem03