दिलचस्प पोस्ट
त्रुटि "'डिक्ट ऑब्जेक्ट' का कोई विशेषता नहीं है 'इटरिटम्स'" जब नेटवर्कएक्स की लिस्ट_एसएचपी () का उपयोग करने की कोशिश कर रहा है एक ही कॉलम में एकाधिक दिनांक प्रारूप कैसे परिवर्तित करें विधि चेनिंग – क्यों यह एक अच्छा अभ्यास है, या नहीं? रिमोट फाइल को अधिलेखित करने के लिए "git push" बल ग्रुप बी के साथ अधिकतम (DATE) क्या गोटो में PHP बुराई है? गिट मुझे पासवर्ड के लिए प्रेरित करती रहती है मैं यूआरएल से यूट्यूब वीडियो आईडी कैसे प्राप्त करूं? बाहरी संबंध और आंतरिक संबंध क्या है? सेवा से एंड्रॉइड अपडेट गतिविधि यूआई कोई समेकित नहीं के साथ पंक्तियों और स्तंभों को स्थानांतरित करें फास्ट क्रॉस-प्लेटफार्म सी / सी ++ इमेज प्रोसेसिंग लायब्रेरीज़ कैसे थ्रेड को .NET के साथ समाप्त करने के लिए प्रतीक्षा करें? क्या सी ++ समर्थन अंततः 'ब्लॉकों? (और यह 'आरएआई' क्या है जिसके बारे में मैं सुन रहा हूं?) Backbone.js पैरामीटर के साथ फ़ेच करें

CSS फ्लेक्सबॉक्स IE10 में काम नहीं कर रहा है

IE10 में, यह कोड सही तरीके से काम नहीं कर रहा है:

.flexbox form { display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; -o-flex-direction: row; flex-direction: row; } .flexbox form input[type=submit] { width: 31px; } .flexbox form input[type=text] { width: auto; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-flex: auto 1; -moz-flex: auto 1; -ms-flex: auto 1; -o-flex: auto 1; flex: auto 1; } 

क्या होना चाहिए यह है कि input[type=submit] को 31px चौड़ा होना चाहिए, input[type=text] साथ input[type=text] उपलब्ध स्थान के बाकी हिस्सों के आकार में क्या होता है input[type=text] किसी कारण के लिए 263px पर डिफ़ॉल्ट होता है

यह Chrome और Firefox में ठीक काम करता है

वेब के समाधान से एकत्रित समाधान "CSS फ्लेक्सबॉक्स IE10 में काम नहीं कर रहा है"

फ्लेक्स लेआउट मोड (पूरी तरह से) IE में अभी तक समर्थित नहीं हैं। IE10 युक्ति का "ट्विल" संस्करण लागू करता है जो पूरी तरह से हालिया नहीं है, लेकिन फिर भी काम करता है।

https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Flexible_boxes

इस सीएसएस-ट्रिक्स लेख में फ्लेक्सबॉक्स के क्रॉस-ब्राउज़र उपयोग (आईई सहित) पर कुछ सलाह है: http://css-tricks.com/using-flexbox/

संपादित करें: थोड़ी अधिक शोध के बाद, आईई 10 फ्लेक्सबॉक्स लेआउट मोड को मार्च 2012 डब्लू 3 सी के मसौदा के विषय में लागू किया गया है: http://www.w3.org/TR/2012/WD-css3-flexbox-20120322/

सबसे मौजूदा मसौदा एक साल या उससे भी ज्यादा समय है: http://dev.w3.org/csswg/css-flexbox/

एन्नूई के रूप में उल्लिखित, आईई 10 -ms के -ms प्रीफिक्स्ड वर्जन का समर्थन करता है (IE 11 इसे अप्रूफिक्स का समर्थन करता है) मैं आपके कोड में देख सकता हूं:

  • आपको display: -ms-flexbox होना चाहिए display: -ms-flexbox बजाय display: -ms-flexbox display: -ms-flex
  • मुझे लगता है कि आपको flex जैसे सभी 3 flex मूल्यों को निर्दिष्ट करना चाहिए flex: 0 1 auto अस्पष्टता से बचने के लिए flex: 0 1 auto

तो अंतिम अद्यतन कोड है …

 .flexbox form { display: -webkit-flex; display: -moz-flex; display: -ms-flexbox; display: -o-flex; display: flex; /* Direction defaults to 'row', so not really necessary to specify */ -webkit-flex-direction: row; -moz-flex-direction: row; -ms-flex-direction: row; -o-flex-direction: row; flex-direction: row; } .flexbox form input[type=submit] { width: 31px; } .flexbox form input[type=text] { width: auto; /* Flex should have 3 values which is shorthand for <flex-grow> <flex-shrink> <flex-basis> */ -webkit-flex: 1 1 auto; -moz-flex: 1 1 auto; -ms-flex: 1 1 auto; -o-flex: 1 1 auto; flex: 1 1 auto; /* I don't think you need 'display: flex' on child elements * / display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; /**/ } 

IE10 ने पुराने वाक्यविन्यास का उपयोग किया है। इसलिए:

 display: -ms-flexbox; /* will work on IE10 */ display: flex; /* is new syntax, will not work on IE10 */ 

css-tricks.com/snippets/css/a-guide-to-flexbox देखें:

(ट्वीनर) का अर्थ है [2012] से एक अजीब अनौपचारिक वाक्यविन्यास (उदाहरण के लिए: फ्लेक्सबॉक्स;)

कृपया ध्यान दें कि फ्लेक्स आइटम प्रदर्शित होना चाहिए: ब्लॉक; IE10 में