flexbox पर टैग किए गए जवाब

मैं फ्लेक्सबॉक्स का उपयोग करना चाहता हूं जिसमें कुछ आइटम हैं जो सभी समान चौड़ाई के हैं। मैंने देखा है कि फ्लेक्सबॉक्स अंतरिक्ष के बजाए समान रूप से अंतरिक्ष को वितरित करता है। उदाहरण के लिए: .header { display: flex; } .item { flex-grow: 1; text-align: center; border: 1px solid …

186 css  flexbox 

निम्नलिखित स्निपेट पर विचार करें: .parent { display: flex; flex-direction: column; width: 400px; border: 1px solid red; align-items: center; } .child { border: 1px solid blue; } <div class="parent"> <div class="child"> Lorem Ipsum is simply dummy text of the printing and typesetting industry </div> <div class="child"> Lorem Ipsum is simply …

176 css  internet-explorer  flexbox  internet-explorer-11 

मैं नेस्टेड फ्लेक्सबॉक्स लेआउट पर काम कर रहा हूं जो निम्नानुसार काम करना चाहिए: सबसे बाहरी स्तर ( ul#main) एक क्षैतिज सूची है जिसे अधिक वस्तुओं के साथ जोड़े जाने पर दाईं ओर विस्तृत होना चाहिए। यदि यह बहुत बड़ा हो जाता है, तो एक क्षैतिज स्क्रॉल पट्टी होनी चाहिए। …

167 html  css  flexbox 

निम्नलिखित लेआउट की कल्पना करें, जहां डॉट्स बक्से के बीच की जगह का प्रतिनिधित्व करते हैं: [Left box]......[Center box]......[Right box] जब मैं सही बॉक्स को हटाता हूं, तो मैं केंद्र बॉक्स को अभी भी केंद्र में रखना पसंद करता हूं, जैसे: [Left box]......[Center box]................. उसी के लिए जाता है अगर …

162 html  css  flexbox  centering 

बंद हो गया । यह प्रश्न राय आधारित है । यह वर्तमान में उत्तर स्वीकार नहीं कर रहा है। इस प्रश्न को सुधारना चाहते हैं? प्रश्न को अपडेट करें ताकि इस पोस्ट को संपादित करके तथ्यों और उद्धरणों के साथ उत्तर दिया जा सके । 5 साल पहले बंद हुआ …

161 html  css  twitter-bootstrap  flexbox 

फ्लेक्सबॉक्स में यह व्यवहार होता है जहां यह चित्रों को उनकी प्राकृतिक ऊंचाई तक खींचता है। दूसरे शब्दों में, अगर मेरे पास बच्चे की छवि के साथ एक फ्लेक्सबॉक्स कंटेनर है, और मैं उस छवि की चौड़ाई का आकार बदल देता हूं, तो ऊंचाई बिल्कुल भी नहीं बदलती है और …

156 html  css  flexbox 

मेरे पास एक कंटेनर <div>है display: flex। इसका एक बच्चा है <a>। मैं बच्चे को "इनलाइन" कैसे दिखा सकता हूं? विशेष रूप से, मैं अपनी सामग्री से बच्चे की चौड़ाई कैसे निर्धारित कर सकता हूं, और माता-पिता की चौड़ाई तक नहीं बढ़ा सकता हूं? मैंने क्या कोशिश की: मैंने बच्चे …

154 html  css  flexbox 

CodePen: http://codepen.io/anon/pen/RPNpaP । मैं चाहता हूं कि लाल बॉक्स केवल 25 एम चौड़ा हो जब यह साइड-बाय-साइड व्यू में हो - मैं इस मीडिया क्वेरी के अंदर CSS सेट करके इसे प्राप्त करने की कोशिश कर रहा हूं: @media all and (min-width: 811px) {...} सेवा: .flexbox .red { width: 25em; …

149 html  css  flexbox 

मैं बीच में आना A Bऔर Cगठबंधन करना चाहूंगा । मैं Dपूरी तरह से दाईं ओर कैसे जा सकता हूं ? इससे पहले: उपरांत: ul { padding: 0; margin: 0; display: flex; flex-direction: row; justify-content: center; align-items: center; } li { display: flex; margin: 1px; padding: 5px; background: #aaa; } …

147 html  css  flexbox 

मेरे पास एक बाएँ-दाएँ flexbox है: .wrapper { display: flex; flex-direction: row; align-items: stretch; width: 100%; height: 70vh; min-height: 325px; max-height:570px; } <div class="wrapper"> <div class="left">Left</div> <div class="right">Right</div> </div> कोड स्निपेट चलाएंपरिणाम छिपाएँस्निपेट का विस्तार करें समस्या यह है कि सही बच्चा जिम्मेदारी से व्यवहार नहीं कर रहा है। विशिष्ट …

141 css  flexbox 

मुझे एक काफी रन-ऑफ-द-मिल चिनाई लेआउट को लागू करने की आवश्यकता है। हालाँकि, कई कारणों से मैं इसे करने के लिए जावास्क्रिप्ट का उपयोग नहीं करना चाहता। पैरामीटर: सभी तत्वों की चौड़ाई समान है तत्वों की एक ऊंचाई है जो सर्वर साइड (एक छवि और पाठ की विभिन्न मात्रा) की …

134 html  css  flexbox  css-grid 

हम सभी जानते हैं, flexसंपत्ति के लिए एक आशुलिपि है flex-grow, flex-shrinkऔर flex-basisगुण। इसका डिफ़ॉल्ट मान है 0 1 auto, जिसका अर्थ है flex-grow: 0; flex-shrink: 1; flex-basis: auto; लेकिन मैंने देखा है, कई स्थानों flex: 1पर उपयोग किया जाता है। क्या यह शॉर्टहैंड है 1 1 autoया 1 0 …

128 css  flexbox 

विशिष्ट सीएसएस के साथ मैं दो गोटों में से एक को छोड़ सकता हूं और दूसरा गटर स्पेस के बीच में। फ्लेक्सबॉक्स के साथ मैं ऐसा कैसे करूंगा? http://jsfiddle.net/1sp9jd32/ #container { width: 500px; border: solid 1px #000; display: -webkit-flex; display: -ms-flexbox; display: flex; } #a { width: 20%; border: solid …

122 html  css  flexbox 

निम्नलिखित कोड इस लाइव उदाहरण में पाया जा सकता है मुझे निम्नलिखित प्रतिक्रिया मूल तत्व मिली है: 'use strict'; var React = require('react-native'); var { AppRegistry, StyleSheet, Text, View, } = React; var SampleApp = React.createClass({ render: function() { return ( <View style={styles.container}> <View style={styles.descriptionContainerVer}> <View style={styles.descriptionContainerHor}> <Text style={styles.descriptionText} numberOfLines={5} …

122 css  reactjs  react-native  flexbox 

मुझे यह धागा मिला - छवि के पहलू-अनुपात को बनाए रखते हुए आप एक <div> भरने के लिए एक छवि को कैसे बढ़ाते हैं? - यह पूरी तरह से वह चीज नहीं है जो मुझे चाहिए। मेरे पास एक निश्चित आकार और इसके अंदर एक छवि के साथ एक div …

120 image  css  positioning  flexbox