亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

引導程序中的統一垂直拉伸單列內容

引導程序中的統一垂直拉伸單列內容

一只名叫tom的貓 2023-04-01 15:42:55
我試圖讓幾個按鈕垂直拉伸到容器的大小,但我不知道我以前是怎么做到的。我已經在https://getbootstrap.com/docs/4.0/utilities/flex/上嘗試了所有的可能性(比如 align-items-stretch、align-self-stretch、align-content-stretch,但似乎都沒有單列垂直拉伸的任何東西,至少我是如何實現它們的。它是怎么做到的?謝謝!(https://codepen.io/jasonws/pen/poyYMpz)<div class="container mt-3">  <div class="d-flex align-content-stretch border" style="height:150px; width:200px; flex-direction: column">    <button type="button" class="btn btn-primary my-1">Flex item 1</button>    <button type="button" class="btn btn-primary my-1">Flex item 2</button>    <button type="button" class="btn btn-primary my-1">Flex item 3</button>  </div></div>
查看完整描述

1 回答

?
MYYA

TA貢獻1868條經驗 獲得超4個贊

只需從 d-flex 類中刪除其他內容


<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container mt-3">

  <div class="border" style="display: grid">

    <button type="button" class="btn btn-primary my-1 m-2">Flex item 1</button>

    <button type="button" class="btn btn-primary my-1 m-2 ">Flex item 2</button>

    <button type="button" class="btn btn-primary my-1 m-2 ">Flex item 3</button>

  </div>

</div>


查看完整回答
反對 回復 2023-04-01
  • 1 回答
  • 0 關注
  • 115 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號