web-dev-qa-db-ja.com

Vuetifyでv-list-tileの高さを調整する

CodePen

関連するセクション:

<v-list-tile>
  <v-list-tile-content>
    <div>
      This is some content that's a little tall.<br />
      Maybe there's a lot of stuff that goes here.<br />
      Or maybe I'm using a third party control.<br />
      Either way, how can I adjust the height?
    </div>
  </v-list-tile-content>
</v-list-tile>

リストを含むVuetifyメニューがあります。リスト項目の1つは、基本スタイルで設定された48pxよりも高くなっています。マークアップでこれを適切に調整する方法はありますか?または、cssを使用して調整する必要がありますか?

7
Mike Cole

ドキュメントによると、 <v-list>two-lineまたはthree-line

さらに、カードを使用することをお勧めします。

3行のリストの場合、字幕は2行で垂直に固定され、次に省略記号で固定されます。 3行以上必要な場合は、 card を使用することをお勧めします。

V-listの目的は、繰り返される要素の高さの均一性を強化することです。したがって、特定のポイントを伝えるために3行以上が必要な場合は、より多くの領域とユースケースをカバーできる繰り返しカード要素を使用するのが理にかなっています。

4
KyleMit