सीएसएस: फ्लेक्स बॉक्स फ़ायरफ़ॉक्स

Question

पर सभी पृष्ठों मुद्रण नहीं मैं एक संरचना इस के समान के साथ एक पृष्ठ है:

main { 
    display: flex; 
    flex-direction: row; 
} 

लेख है:

<main> 
    <section> 
     <article></article> 
     <aside></aside> 
    </section> 
</main> 

सीएसएस में, मैं निम्नलिखित शामिल हैं अक्सर कई पेज लंबा।

जब मैं पूर्वावलोकन प्रिंट या प्रिंट करता हूं, तो मुझे लगता है कि यह केवल मुझे पहला पृष्ठ या तो देता है।

@media print { 
    aside { 
     display: none; 
    } 
    main { 
     display: block; 
    } 
} 

यही है, display: block का उपयोग कर मैं फिर से मुद्रित करने के लिए सभी पृष्ठों को प्राप्त कर सकते हैं द्वारा: कुछ प्रयोग करने के बाद, मैं इस समाधान मिल गया है। इस मामले में, यह ठीक है, क्योंकि मैं प्रिंट करने के लिए aside नहीं चाहता, इसलिए मुझे flex व्यवहार की आवश्यकता नहीं है, लेकिन यह हमेशा ऐसा नहीं होता है।

यह सफारी और क्रोम पर अच्छी तरह से काम करता प्रतीत होता है। मैं मैक पर इसका परीक्षण कर रहा हूं।

यह फ़ायरफ़ॉक्स पर क्यों काम नहीं करता है?

वास्तविक पृष्ठ यहां पाया जा सकता है: https://www.thewebcoder.net/articles/toggling-attributes। यह अभी भी शुरुआती चरणों में है।

Answer 1

कुछ समय के लिए इसे ध्यान में रखते हुए, मुझे अभी भी यकीन नहीं है कि फ़ायरफ़ॉक्स के बारे में क्या फ्लेक्स कंटेनरों को काटने का कारण बनता है। मुझे बगजिला (उदाहरण के लिए https://bugzilla.mozilla.org/show_bug.cgi?id=258397) पर कुछ बेहद पुरानी बग रिपोर्ट मिलीं, लेकिन body टैग पर ओवरफ़्लो गुणों के साथ उनका कुछ संबंध था। दुर्भाग्यवश, इसके लिए शरीर के अतिप्रवाह को समायोजित करने का प्रयास कुछ भी नहीं करता है।

मैं भी Bootstrap 4's page पर गया जो फ्लेक्सबॉक्स के आधार पर लेआउट का उपयोग करता है। निश्चित रूप से, फ़ायरफ़ॉक्स पर इसे मुद्रित करने का प्रयास एक ही समस्या में परिणाम।

अंत में, यहां तक ​​कि display: inline-block का भी प्रभाव है।

ऐसा लगता है कि प्रिंट पर display: block को मजबूर करना यह सुनिश्चित करेगा कि फ़ायरफ़ॉक्स सही तरीके से पैगिनेट करेगा। आदर्श रूप में, प्रिंटिंग के लिए उपयोग किए जाने वाले लेआउट जितना संभव हो उतना आसान होगा ताकि यह बाधा का अधिक न हो। फिर भी, यह कम से कम मेरे लिए बहुत आश्चर्यजनक है।

शायद अधिक ज्ञान वाला कोई व्यक्ति चिपका सकता है और सूचित कर सकता है कि यह एक वैध फ़ायरफ़ॉक्स बग है या सिर्फ उनके डिजाइन दर्शन का एक हिस्सा है।