फ्लेक्सबॉक्स प्रचलित शब्दावली (टर्मिनॉलॉजि) आणि पाया

हे शब्द नीट लक्षात ठेव,
कारण पुढील पूर्ण प्रशिक्षणात हे सतत वापरात असतील

एखाद्या container ला जेव्हा आपण display:flex हि स्टाईल देतो तेव्हा तो flex-container होतो आणि तो त्याच्यातील child elements ला flex-items मध्ये आपोआप convert करतो.
आता ते एकाखाली एक ना दिसता एकमेकांच्या बाजूला दिसू लागतात
फ्लेक्सबॉक्स मध्ये आपण X-axis ला main-axis आणि Y-axis ला cross-axis म्हणतो

.container {
   display:flex;
}

सगळ्या advanced browser मध्ये चालण्यासाठी browser hacks टाकणे चांगले

.container {
   display: -webkit-box;
   display: -moz-box;  
   display: -ms-flexbox;
   display: -webkit-flex;
   display: flex;
}

display:flex प्रमाणे display:inline-flex हि वापरात आहे, display:flex जिथे पूर्ण जागा घेते तिथे display:inline-flex फक्त हवी तितकीच जागा घेते.
हे चित्र पाहून तुम्हाला सहज समजेन