पर काम नहीं कर रहा है नीचे दिए गए उदाहरण में, सभी स्थिर फ्लेक्सबॉक्स-सक्षम ब्राउज़र पृष्ठ को सही ढंग से प्रस्तुत करते हैं।फ्लेक्सबॉक्स "संरेखण-आइटम: केंद्र" क्रोम बीटा
jsfiddle here देखें।
क्योंकि align-items: center; के तीन रंग का ब्लॉक समान रूप से section तत्व में वितरित कर रहे हैं:
हालांकि नवीनतम क्रोम बीटा (54) और कैनरी (55) संस्करणों पर, एक ही उदाहरण प्रदान की गई हो जाता है इस तरह:
यह अगले संस्करणों में align-items के लिए अपेक्षित व्यवहार होने जा रहा है ओ एफ क्रोम? या यह एक बग
अद्यतन
Michael_B's answer इस विशेष लेआउट में align-items और align-content बीच के अंतर को मंजूरी दे दी है ...। लेआउट का परीक्षण करने के लिए उनके jsfiddle का उपयोग किया जाना चाहिए।
फिर भी, यहां तक कि सही flexbox संपत्ति के साथ, क्रोम बीटा और कैनरी लेआउट रास्ता प्रतिपादन नहीं कर रहे हैं तो वे:
'align-items' आइटमों की एक पंक्ति में आइटम को संरेखित करना है (इसलिए नाम)। एकाधिक लाइनों (सभी सामग्री जो है) को केंद्रित करने के लिए, 'संरेखण-सामग्री: केंद्र;' का उपयोग करें। – Paul
'संरेखण-सामग्री: केंद्र;' लंबवत केंद्रित समस्या को हल करता है, लेकिन तत्वों को समान रूप से इस तरह वितरित नहीं किया जाएगा। – DeanAlexRainier
सही, मैंने सोचा कि सवाल केंद्र के बजाय शीर्ष पर होने वाली लाइनों के बारे में होगा।क्या आपने 'संरेखण-सामग्री' की कोशिश की: अंतरिक्ष-चारों ओर; '? क्या यह आपको अपेक्षित परिणाम देगा? उदाहरण के लिए – Paul