ホワイトスペース: nowrap with flex: 1; 子の幅が小さすぎてテキストを収容できません
P粉776412597
P粉776412597 2023-09-04 13:30:47
0
1
447
<p>同じサイズの 2 つの div をテキストに 1 行に収める解決策が見つかりません。空白のように見えます。親の width:fit-content を設定した後、幅は考慮されなくなりました。 </p> <p>これらは可能な限り小さく、常に同じサイズにする必要があり、テキストを 2 行目に折り返さないでください。 </p> <p> <pre class="ブラシ:css;ツールバー:false;">div { ディスプレイ: フレックス; 幅: コンテンツに合わせて; } 。ボタン { パディング: 10px 20px; フレックス: 1; ホワイトスペース: ナラップ; 最小幅: 130px; 幅: コンテンツに合わせて; } .button1 { 背景: 赤; } .button2 { 背景: 緑; }</pre> <pre class="brush:html;toolbar:false;"><div> <div class="button button1">短いテキスト</div> <div class="button button2">幅が広い長いテキスト ボタン </div> </div></pre> </p>
P粉776412597
P粉776412597

全員に返信(1)
P粉156532706

CSS グリッドを使用して実行できます:

リーリー リーリー
いいねを押す +0
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート