flexbox

    1熱度

    1回答

    我是flexbox的新手,並試圖理解它。我試圖將包含包含元素的div居中,但也將這些元素左對齊。 我在這裏有一個codepen(https://codepen.io/anon/pen/GOWBxY),但所有元素都居中! body { margin: 0px; } .container .card { padding: 20px 20px;

    0熱度

    1回答

    這是一個非常簡單的結構,我可以不使用Flexbox的實現。 我有一個報頭和主體我有一個長(高)元件內的主體元件和後,我有身體內的小頁腳。我希望內容可以滾動並且頁腳始終可見。 我將所有的東西都設置爲使用flexbox,我使用flex-direction: column來實現垂直定位,以及flex: 1使用高度未定義的元素佔據剩餘空間。 奇怪的是,我固定高度爲50像素的標頭只有20像素高,內容根本不可

    0熱度

    2回答

    你好我想要有三組三個按鈕,每個組出現在一個單獨的行上,我設法通過將它們與div分組來實現此目的,但是當我使用flexbox將按鈕定位頁面的中心,所有按鈕都顯示在一行上。有沒有一種方法可以使用flexbox進行定位,並且仍然可以在單獨的行上使用按鈕? html,body{ \t margin:0; \t padding:0; \t height:100%; \t width:

    1熱度

    2回答

    我試圖模仿堆棧導航標題象下面這樣: 在標題完全集中而有左側同一行中返回按鈕。 我試圖用justifyContent: 'space-between'在右側有一個空的View,但標題會偏離右側一點。我應該如何處理這個問題? 我renderHeader功能: _renderHeader =() => { return ( <View style={styles.headerAbso

    0熱度

    1回答

    我有一個自定義的最小的無狀態組件是這樣的: const ViewBox = (props) => ( <View style={ mainStyle : {backgroundColor: 'beige'} }> {props.children} </View> ) export default ViewBox; 所以我想導入和使用它的另一個組件中。 expo

    -1熱度

    1回答

    我在超大屏幕嘗試過這種垂直中心的所有項目, display: flex; justify-content: center; align-items: center; 但問題是所有項目都在單行列隊像他們顯示在線。你如何垂直居中,同時仍然以塊形式顯示它們。

    1熱度

    2回答

    我試圖解決flexbox問題,我想每行有三個div,首先大小相等,但是當懸停div時,該增長和其他的在同一行收縮。以爲我已經解決了它,直到我嘗試了多行。 我想要的是當懸停第三個div時,它會縮小第一個和第二個div,並保持其餘不變。我無法弄清楚這一部分。 以下是我的單排工作解決方案。 此佈局是否也可以在多行上工作? 我是否必須將每行包裝在單獨的容器中,還是有辦法解決這個問題? .container

    0熱度

    1回答

    我正在實施媒體查詢的移動第一種方法。我爲平板電腦和臺式機設置了37.5em和50em的最小寬度媒體查詢。 我希望項目部分顯示爲移動的列和行的桌面。我的桌面媒體查詢似乎可以完成其他任何事情。 HTML: <section id="projects"> <h2>Projects</h2> <div id="projects_container"> <figure class="hvr-fl

    0熱度

    3回答

    我的問題是,無論何時調整窗口大小,如果沒有與所有其他div的大小相同的大小,div應該跳到下一行。 在「整頁」中查看此內容並嘗試調整自己的大小。 <html> <body> <div id="wrapper" style="display: flex; width: 100%; flex-wrap: wrap; justify-content: center;">

    0熱度

    1回答

    共享專欄中,我想打一個holygrail般的佈局如下: 將變成一個小屏幕上顯示如下: 有沒有CSS的方式來做到這一點,沒有JS黑客?