फ़ायरफ़ॉक्स केवल 1 पृष्ठ

Question

प्रिंटिंग मैं वेबसाइट के लिए प्रिंट अनुकूल सीएसएस पर काम कर रहा हूं। यह आईई में पूरी तरह से पूर्वावलोकन/प्रिंट करता है, लेकिन फ़ायरफ़ॉक्स (संस्करण 3.6) केवल पहले पृष्ठ का पूर्वावलोकन/प्रिंट करता है।

क्या किसी को भी ऐसा कुछ भी पता है जो आम तौर पर इसका कारण बनता है? मार्कअप काफी जटिल है, इसलिए मुझे यकीन नहीं है कि कहां से शुरू करना है!

धन्यवाद।

संपादित

यह समाधान केवल बातें बदतर बना दिया।

https://support.mozilla.com/ga-IE/questions/667285#answer-115916

ऐसा लगता है कि मुद्रण सिर्फ एफएफ में बेकार है। ग्राहक यह सुनना पसंद नहीं करेगा - उम्मीद है कि वे एफएफ का उपयोग नहीं करते हैं!

Answer 1

long-standing bug with printing absolutely-positioned elements फ़ायरफ़ॉक्स 3. में तय किया गया था

लापता पृष्ठों की समस्याओं को bug 521204 में ट्रैक किया जाता (के माध्यम से सूची "पर निर्भर करता है" देखो)। क्या आपके पास प्रिंट करने की कोशिश कर रहे पृष्ठ पर फ्रेम या लंबी टेबल हैं?

और हाँ, Firefox में मुद्रण के तहत स्वामित्व वाली, खेद है कि आपको इससे निपटने के लिए ...

Answer 2

आप मुद्रण पर Firefox के सीमाओं को पार करने में असमर्थ हैं, तो आप एक पीडीएफ के लिए पेज में परिवर्तित कर सकते है। यदि आप उस विकल्प के लिए हैं, तो Prince XML एक ऐसी लाइब्रेरी है जिसे मैं अत्यधिक अनुशंसा करता हूं। प्रिंट मीडिया सहित इसमें बहुत अच्छा सीएसएस समर्थन है।

Answer 3

फ़ायरफ़ॉक्स निश्चित रूप से किसी भी सम्मान में चूसना नहीं करता है। हालांकि, कभी-कभी यह अन्य ब्राउज़रों की तुलना में मानक के लिए अधिक सख्ती से पालन करता है। वैसे भी, पीछा करने के लिए कटौती करने के लिए, मुझे एक ही समस्या थी, यानी फ़ायरफ़ॉक्स एक मल्टीपाज रिपोर्ट के पहले 2 पृष्ठ प्रिंटिंग (पूर्वावलोकन भी कर रहा था), एक लंबे टेबल के साथ बनाया गया था, जो मेरे वेबपृष्ठ द्वारा उत्पादित किया गया था। कुछ डिबगिंग के बाद मुझे पता चला कि मैंने अन्य चीजों के साथ {प्रदर्शन: इनलाइन-ब्लॉक;} की शैली के साथ एक स्पैन तत्व के अंदर अधिकांश रिपोर्ट की सामग्री शामिल की थी। जैसे ही मैंने हटा दिया कि पृष्ठांकन सही था ...

Answer 4

मैं सिर्फ पता चला, कि एक तत्व से

display:inline-block; 

साथ केवल प्रथम पृष्ठ छपा है और बाकी प्रत्येक भाग को छिपा हुआ है। इसे

display:block; 

मेरे मामले में समाधान था।

Answer 5

मुझे एक ही समस्या थी। बाहर निकलता है, रूट टैग पर display: flex था। इसे display: block पर बदलने के बाद, शेष सामग्री प्रदर्शित की गई थी। मैं आपके डीओएम पेड़ को ऊपर जाने और हर display विशेषता की जांच करने की सलाह दूंगा।

@media print { 
    body { 
    overflow: visible !important; 
    } 
} 

Answer 6

आप अपने कोड के सभी के माध्यम से जाना नहीं चाहते हैं, इस एक ही चीज़ मैंने पाया कि मेरे अन्य सीएसएस के सभी अप खिलवाड़ के बिना मेरे लिए काम करता है इस के लिए दर्जन सुधारों और अंत में, सभी मैं जरूरी था:

@media print { 
    body { 
    display: block; 
    } 
} 

Answer 7

मैं एक करने की कोशिश की:

Answer 8

मैं क्योंकि body की height100% के लिए सेट है एक ही मुद्दा था, के बाद मैं अपने print.css में height: auto करने के लिए संशोधित, यह काम किया।

@media print { 
    body { 
    height: auto; 
    } 
} 

Answer 9

अनुसंधान और परीक्षण & त्रुटि का एक बहुत बाद, मैं this article एक सूची से अलग मिल गया है। मैं उलझन में था, क्योंकि यह वर्ष है, लेकिन यह कहा गया है कि:

एक जारी तत्व एक मुद्रित पृष्ठ के नीचे अतीत चलाता है, नाव के बाकी को प्रभावी ढंग से गायब हो जाएगा क्योंकि वह अगले पर प्रिंट नहीं होगा पृष्ठ।

जैसा कि मेरे पास एक बड़ा फ्लोट कंटेनर है, मैंने सोचा कि मैं इसे आज़मा दूंगा। तो, मैं अन्य उत्तर से मिश्रण और इस लेख बना दिया है और इस के साथ आया था:

body { 
    overflow: visible !important; 
    overflow-x: visible !important; 
    overflow-y: visible !important; 
} 

/*this is because I use angular and have this particular layout*/ 
body > .fade-ng-cloak { 
    height: 100%; 
    display: block; 
    flex: none; 
    float: none; 
} 
.l-content, 
.l-sidebar { 
    float: none; 
} 

तो मूल रूप से:

1. स्थापना शरीर overflow: visible सेटिंग तत्वों कि display: block को रैपर के रूप में व्यवहार करने के लिए
2. , सभी flex शैलियों को खत्म करें और आवश्यक होने पर ऊंचाई रीसेट करें
3. लंबे कंटेनर पर float को हटाएं

उस मिश्रण ने मेरे लिए काम किया! मुझे बहुत खुशी है कि मैंने सोचा था कि मैं साझा करूंगा :)

Answer 10

मेरे पास एक ही समस्या थी और मैंने position:relative से position: absolute से height: 100% के साथ शीर्ष div से नीचे की स्थिति बदल दी।