flexbox

0熱度

1回答

我正在使用@ angular/cli @ 1.4.3。建設之前，我使用gulp-postcss autoprefix我的CSS。它工作的一種享受。下面是它創建的CSS樣本（爲了便於閱讀而未縮小）： form.registration-form { display: -webkit-box; display: -webkit-flex; display: -ms-fl

1熱度

1回答

CSS響應flex寬度，固定邊距，但高度自動匹配圖像內容的高度

我想有3個div流暢地響應（規模寬度和高度保持相同的比例）到瀏覽器寬度。我的大部分圖像都是垂直的，所以我創建爲overflow: hidden的原因是因爲我不介意爲很長的圖像隱藏部分圖像 - 例如想想網站的截圖！但是在某些情況下，一些圖像更短，所以在這種情況下該怎麼做？也許使用JS？這是我的代碼：https://codepen.io/anon/pen/wrygJE .flex1 {

0熱度

1回答

如何確保元素不會疊加在原生反應中？

現在我有一個react-native-elements-header與react-native-snap-carousel包裹在一個簡單的容器如下： render() { return ( <View style={styles.container}> <Header outerContainerStyles={styles.header}

1熱度

1回答

Flexbox環繞 - 滾動隨100vh機身消失

我正在用flexbox構建多列頁面佈局，感覺有點響應。這是我的代碼。 <!doctype html> <html> <head> <meta charset="utf-8"> <title>Index</title> <link rel="stylesheet" href="basic.css"> </head> <body> <header c

3熱度

3回答

Flexbox的響應行列布局

我有以下 HTML <div> <div class="left"></div> <div class="center"></div> <div class="right"></div> </div> 我想要實現使用Flexbox的下列布局。移動平板桌面我對移動和桌面佈局沒有問題，但無法爲平板電腦解決問題。如何強制.center div出現後.letf

0熱度

3回答

發現很難實現照片網格佈局

我很難實現這個確切的照片網格有關如何去做的任何想法？ enter image description here 澄清，我已經有工作原型enter image description here這與Flexbox的做，但一個wasnt fiting井，所以我不得不使用的犯規對其他屏幕大小顯示在正常工作的絕對位置。繼承人是我的代碼 .container-ed { padding: 0px

1熱度

4回答

反應原生flex 50％導致錯誤

我試圖學習反應原生。我有以下代碼： <View> <View style={{flex:0.5,flexDirection="row"}}> <Image source={{uri:"http://image.com/image1.jpg"}} style={{width:100,height:'auto'}} resizeMode={"cover"} /> <

0熱度

1回答

生成Flex容器寬度增長作爲其子

這是簡化的佈局： <div class="root"> <div class="container"> <div class="cell"> <input type="text" class="contact"></input> </div> </div> </div> ，這是簡化的CSS： .root { background-

0熱度

1回答

將屏幕上的彈性元素啓動到位置

我在確定如何最好地使該動畫起作用時遇到了一些麻煩。我有兩個在flexbox佈局中垂直居中的元素，我想通過從屏幕外滑入來讓這些元素動畫到他們的最終位置，但是，這似乎給我帶來了一些意想不到的結果因爲它們的柔性定位。有關我如何解決這個問題的任何想法？這裏是一個顯示當前狀態的東西，我已經放慢了動畫，所以你可以看到困境和我試圖採取這一點。 .scroller-item-wrapper { di

1熱度

2回答

如何在不使用溢出的情況下襬脫滾動條：隱藏？

我想要一個70px及以下的標題，兩列佔據屏幕高度的其餘部分，並且不會超出屏幕高度。左欄是100％的寬度。右欄是30％的寬度，位於左欄的上方（重疊）。我在這裏的問題是，#left和#right的高度是頁眉高度的+ 100px +頭部的70px。我如何擺脫高度的70px？ *{ margin: 0; padding: 0; } html, body{ height