इनलाइन-ब्लॉक और टेबल-सेल के बीच अंतर क्या हैं?सीएसएस इनलाइन-ब्लॉक बनाम टेबल-सेल
मुझे पता चला है कि ये दो शैलियों समान हैं। उदाहरण के लिए आप जो भी शैली बनाते हैं। आदि display: inline-block; या display: table-cell; की पहचान करके वही काम करेगा।
कृपया महत्वपूर्ण मतभेदों को सूचित करें।
display:table-celldisplay:table-row के अंदर उपयोग के लिए है, स्वयं display:table के अंदर। अनुचित उपयोग के परिणामस्वरूप अनाम तत्व बनेंगे, जो आपके लेआउट के अन्य पहलुओं के साथ नकारात्मक रूप से पूर्ण हो सकता है।
कहा जा रहा है कि, vertical-align दोनों में बहुत अलग अर्थ हैं। display:inline-block में, यह संदर्भित करता है कि तत्व स्वयं आसपास के तत्वों के साथ कैसे संरेखित होता है। दूसरी ओर, display:table-cell के साथ, यह इसके अंदर तत्वों के लंबवत संरेखण को प्रभावित करेगा।
display: table-cell और display: inline-block; समान भ्रमित कर रहे हैं लेकिन उनके बीच बहुत अंतर है। display: inline-block;display: table-cell; के रूप में व्यवहार नहीं करेगा i.e. इनलाइन-ब्लॉक ब्लॉक स्तर के रूप में व्यवहार करेगा जब आपके ब्राउज़र को फिर से आकार दिया जाएगा या display: table-cell; नहीं होने पर आपकी सामग्री इसकी चौड़ाई से अधिक हो जाएगी।
आप उन्हें here
के बीच मतभेदों को देख सकते हैं जब आप Ctrl कुंजी दबाकर और स्क्रॉल बटन के साथ स्क्रॉल मतभेद देखने के लिए द्वारा display: inline-block; फिर से आकार अपने विंडो लागू तुम भी ब्लॉक के बीच की खाई मिल जाएगा।
vertical-align: middle;display: inline-block; में display: table-cell; के रूप में काम नहीं कर रहा है। यदि आपके पास डेमो काम कर रहा है तो कृपया एक साझा करें।
तत्व ऊंचाई और लंबवत-संरेखण के बराबर लाइन-ऊंचाई सेट इनलाइन-ब्लॉक के लिए काम करेगा। –
कोई आश्चर्य नहीं कि हर कोई सीएसएस से नफरत करता है ... हर जगह कैच –