IE8

Question

में तालिका टैब स्क्रॉल मेरी प्रोजेक्ट में, मैं IE12 में tbody स्क्रॉल करने की कोशिश कर रहा हूं। मुझे पता है कि इसे overflow: autotbody देकर स्क्रॉल किया जा सकता है। लेकिन यह IE8 में काम नहीं करता है। इसे IE8 में काम करने के लिए, tbodyposition: absolute (या float: left दोनों thead और tbody दोनों को दिया जाना चाहिए)। अगर मैं overflow: auto काम करता हूं तो प्रतिशतों में th और td को दी गई चौड़ाई को अनदेखा किया जा रहा है। जो बदले में tr को thead और tbody में पूर्ण चौड़ाई पर कब्जा करने के लिए नहीं दे रहा है। इसलिए, tr और tbody/thead के बीच एक परेशान स्थान है।

कृपया आईई 8 में इस demo का परीक्षण करें। (फ़ायरफ़ॉक्स और क्रोम में ठीक काम करता है)

और यहां fiddle में कोड है।

यहाँ सख्त अंक जो मैं td को

• चौड़ाई को बदल नहीं सकते और th प्रतिशत में होना चाहिए रहे हैं।
• मैं HTML मार्कअप
• नहीं बदल सकता है इसे केवल सीएसएस का उपयोग करके हल किया जाना चाहिए।

वास्तव में, मैं के रूप में

th:after,td:after{ /* only to the last column, first occurence */ 
    content: "..................................................."; 
    visibility: hidden; 
} 

इस प्रकार एक गंदा ठीक है, जिसके साथ उसे हल किया उपरोक्त कोड भी डेवलपर उपकरण में एक विशिष्ट टीडी/वें के लिए कई बिंदुओं देकर जाँच की जा सकती

उपरोक्त कोड ठीक दिखता है लेकिन मुझे :after छद्म चयनकर्ता केवल पहली पंक्ति के अंतिम स्तंभ th और tr देने की आवश्यकता है। अगर मैं हर th और tr को देता हूं तो लेआउट गड़बड़ हो रहा है। और और tbody के बीच खाली स्थान अधिक होने पर dots भी बढ़ाना चाहिए। फिर यह केवल गतिशील रूप से हासिल किया जा सकता है जो मैं अपने वर्तमान प्रोजेक्ट में नहीं कर सकता।

पीएस: मैं इसे पूरी तरह से गलत कर रहा हूं। मैं बस अपने प्रयासों को साझा कर रहा हूं जहां मैं परिणाम के नजदीकी पहुंच गया।

Answer 1

मुझे आईई 8 में इस समस्या को हल करने के दो तरीके मिले।

              1)     thead और tbody की width: 0pxtr करने के की अतिरिक्त td तत्व जोड़ना।

IE8 demo

              2)     after छद्म चयनकर्ता की सामग्री के लिए एक छिपे हुए पत्र जोड़ना।

tr:after{ 
     content: "."; 
     visibility: hidden; 
    } 

मैं सशर्त सीएसएस में ऊपर गयी। क्योंकि समस्या केवल आईई 8 में थी। (मैं IE9 + में परीक्षण नहीं किया)

<!--[if IE 8]> 
     <style> 
      /* the above css code here */ 
     </style> 
    <![endif]--> 

IE8 demo

मैं बाद एक का उपयोग किया है, क्योंकि यह आसान है।