flexbox

    1熱度

    1回答

    我有兩列。 在我的左欄中我有一個p標籤。 這個p標籤有很多文字,並且在我的專欄之外非常廣泛。 當我刪除我的p標記列布局看起來很好。 我試過在p標籤上設置max-width,但是這不是很好的迴應。我希望p標記是col div的100%寬度。 我希望文字的寬度達到100%並很好地包裹。 .wrapper { display: flex; flex: 1 0 auto;

    0熱度

    1回答

    我有一個div內的3項。 這個容器需要100%的小部件和水平滾動條。 所以就像一個旋轉木馬。 .wrapper { display: flex; flex: 1 1 0; overflow-x: scroll; overflow-y: hidden; } .content { display: flex;

    0熱度

    1回答

    的線我不太清楚,如果這是可能的CSS,但沒有找到那個方向什麼,但我會搏一搏: 在(Flex的) - 容器我想要多個(2-3)框/列的文本。每一列都是它自己的文章,它有自己的標題,所以它不是一個文本繼續到下一列。 但是,我希望所述列的寬度是靈活的,以便沒有列浪費空白空間直到結束。如果一列有空行,它會嘗試減小寬度以爲自己創建更多換行符並填充該空白,而其他框獲得更多寬度以減少文本行數。 在任何情況下,所

    0熱度

    2回答

    使用Bootstrap 4,我有一個響應式佈局,包含3列,(應該)在不同的屏幕尺寸上更改順序,寬度和水平對齊。它所有的工作,只是在屏幕大小< 768px的IMGS的水平居中對齊不正常工作。這裏是我的代碼: .icon-xl-large { width: 80px; } .w-400px { max-width: 400px; } <link hr

    -2熱度

    2回答

    我試圖做到這一點的設計... 但結果不出我所料,我不是真的清楚如何與柔性嘗試此屬性和bootstrap,但它們不是我的強項。請解釋,解決方案背後的步驟或鏈接/視頻到可以的網站。 .Charlie{ border: solid 1px #333; text-align:center; display: flex; height: 786px; width: 550px;

    0熱度

    1回答

    我試圖使用Flex箱技術,https://css-tricks.com/couple-takes-sticky-footer/來響應下推頁腳在我的網頁http://apple.mdsc1.com/test/ 我用: - <style> #wrapper {flex: 1 0 auto;} body, html {height: 100%} body { d

    1熱度

    1回答

    我在flex容器中的圖像出現問題。當容器/窗口高度減小/調整大小時,我希望它保持比例。 Sample fiddle html, body { height: 100%; } .wrapper { display: flex; width: 100%; height: 60%; border: 1px so

    1熱度

    1回答

    獲得MD分壓器我知道MD-分頻器是MD-名單,但我想它在柔性佈局 例如: <div layout="row" layout-wrap> <div flex="100"></div> <md-divider></md-divider> <div flex="100"><div> </div> 應該得到horizantal兩個div之間的另一種情況 <div lay

    0熱度

    3回答

    什麼是最簡單的方法來選擇flexbox容器的所有子元素,並給他們所有相同的餘量,例如? 例子: <div class="flexboxcontainer"> <h1>Headline</h1> <p>Some Text</p> <div>Some more text</div> <p class="smalltext">Some small text</p> </div>

    0熱度

    1回答

    我試圖用Flexbox的做到這一點=> 桌面: | | | block 1 | | block 2 | | | | block 3 | 移動: block 1 block 2 block 3 我來到這個 .cont { display: flex; flex-direction: column; flew-wrap: wrap-reverse;