कौन से ब्राउज़र सीएसएस और पृष्ठ-ब्रेक-इन तत्व का उपयोग कर पेज ब्रेक मैनिपुलेशन का समर्थन करते हैं?

Question

मैं पृष्ठ-ब्रेक-इन-सीएसएस निर्देश का उपयोग करने की कोशिश कर रहा हूं, जिसकी कक्षा को div टैग या टेबल टैग से जोड़ा जाना है (मुझे लगता है कि यह केवल ब्लॉक तत्वों पर ही काम कर सकता है, इस मामले में टेबल होने के लिए)।

मैंने उन सभी ट्यूटोरियल की कोशिश की है जो अनुमान लगाते हैं कि यह कैसे करना है, लेकिन कुछ भी काम नहीं करता है। इस ब्राउज़र समर्थन का एक मुद्दा है या किसी को भी वास्तव में इस काम के हो गया है, सीएसएस की सटीक बिट इस तरह दिखता है:

@media print { 

    .noPageBreak { 
    page-break-inside : avoid; 
    } 
} 

Answer 1

Safari 1.3+, Opera 9.2+, Konquerer, और IE8 सभी का समर्थन यह, कम से कम कुछ हद तक।

Firefox स्पष्ट रूप से अभी भी नहीं है।

Answer 2

मैं पेज ब्रेक-अंदर सीएसएस निर्देश, एक div टैग या एक मेज टैग (मुझे लगता है कि यह केवल ब्लॉक तत्वों पर काम कर सकते हैं, के साथ संलग्न किया जा सकता है वर्ग जिनमें से उपयोग करने के लिए कोशिश कर रहा हूँ, जिसमें मामले में यह टेबल होना होगा)।

सबसे पहले, अनुमान लगाने की कोई आवश्यकता नहीं है। बस the specification देखें, और आप देखेंगे कि यह वास्तव में केवल ब्लॉक-स्तर तत्वों पर लागू होता है।

दूसरे, <div> तत्वों आमतौर पर ब्लॉक स्तर तत्व हैं, इसलिए वहाँ एक <div> तत्व को page-break-inside लागू करने कोई समस्या नहीं है।

अंत में, आपको इसे @media में लपेटने की आवश्यकता नहीं है। यदि आप मीडिया-स्वतंत्र नियमों को केवल एक माध्यम में लागू करना चाहते हैं, तो आपको केवल @media की आवश्यकता है, उदाहरण के लिए, यदि आप केवल एक माध्यम के लिए display: block का उपयोग करना चाहते हैं। इस मामले में, आपको उन नियमों को अन्य मीडिया से छिपाने की आवश्यकता नहीं है, क्योंकि वे केवल पगेड मीडिया पर ही लागू होंगे।

Answer 3

Safari 1.3 and later समर्थन page-break-inside।

So does Konqueror।

Answer 4

सफ़ारी 1.3 और बाद में (पता नहीं है के बारे में 4) ऐसा नहीं सहायता पृष्ठ-अलग होने के अंदर (यह प्रयास करें, या यहाँ देखें: http://reference.sitepoint.com/css/page-break-inside)। फ़ायरफ़ॉक्स 3 या आईई 7 न करें (8 के बारे में नहीं पता)।

व्यावहारिक अर्थ में, इस विशेषता के लिए समर्थन SO spotty है, इस बिंदु पर इसका उपयोग करने के लिए यह समझ में नहीं आता है। आप भाग्यशाली होंगे अगर आपके 10% आगंतुकों के पास ब्राउज़र भी हैं जो इसका समर्थन कर सकते हैं।

समाधान मैं इस्तेमाल किया कुछ divs को

page-break-after:always

जोड़ने के लिए, या एक "पेज ब्रेकर" जहाँ आप टूट जाता है चाहता हूँ में div जोड़ने के लिए किया गया था। यह काफी हद तक है, मुझे पता है, क्योंकि यह वही नहीं करता जो आप चाहते हैं, और सामग्री को मुद्रित पृष्ठ के नीचे तक नहीं पहुंचने का कारण बनता है, लेकिन दुर्भाग्यवश कोई बेहतर समाधान नहीं है (मुझे गलत साबित करें!)।

एक और तरीका एक स्टाइलशीट बनाने के लिए है जो सभी बाहरी तत्वों (display:none) को हटा देता है और मुख्य सामग्री को मुख्य स्तंभ में बहने का कारण बनता है। असल में, इसे एक कॉलम, टेक्स्ट-केवल दस्तावेज़ में बदल दें।जब प्रिंटर के लिए स्टाइल

अंत में, तैरता और स्तंभों से बचने के लिए, यह आईई (और एफएफ) कर सकते हैं निराला काम करते हैं।

Answer 5

प्रारंभिक खोजों से, यह इस के लिए ब्राउज़र समर्थन पर अप-टू-डेट आंकड़े प्राप्त करने का कठिन है, लेकिन ऐसा लगता है कि फ़ायरफ़ॉक्स 4beta6 इसका समर्थन करता है और क्रोम 7 नहीं करता है। क्रोम टेक्स्ट की एक पंक्ति के माध्यम से आधा रास्ते भी तोड़ता है, ताकि पाठ का हिस्सा एक पृष्ठ पर दिखाई दे और भाग अगले भाग पर दिखाई दे। विस्तार पर ध्यान देने की अनैच्छिक कमी, लेकिन मुझे लगता है कि न तो Google और न ही ऐप्पल प्रिंटिंग चीजों के बारे में परवाह है।

फ़ायरफ़ॉक्स 4 भी यूआरएल, पृष्ठ शीर्षक, साइट शीर्षक, पृष्ठों की संख्या है, और समय के साथ अपने प्रिंट करने के लिए कुछ अच्छा शीर्षलेख और पादलेख कहते हैं। अच्छा लगा।

Answer 6

• फ़ायरफ़ॉक्स does not support this 2010-11-30 के रूप में, और इस तरह नहीं होगा फ़ायरफ़ॉक्स 4.
• IE8 does support page-break-inside: avoid में - (लेकिन जब मैं IE9 पर इस की कोशिश की, यह पेज ब्रेक से बचने में बहुत सफल नहीं है यह एक रिग्रेशन हो सकता है, या शायद आईई 8 बहुत ही सरल मामलों में पेज ब्रेक से बचने में सक्षम है)।
• AFAIK यह किसी भी वेबकिट ब्राउज़र में काम नहीं करता है; निश्चित रूप से क्रोम में नहीं।
• यह वास्तव में वास्तविक साइटों पर भी ओपेरा में काम करता है।

Answer 7

आईई रेंडरिंग (आईई 8 +) पर Eamon Nerbonne's answer पर थोड़ी अधिक जानकारी के रूप में, आपको यह सुनिश्चित करना होगा कि ब्राउजर मानक मोड में है। This article on MSDN पता चलता है कि आवश्यक है - अपने html में एक मेटा टैग मुद्दा मजबूर करने के लिए शामिल हैं:

<meta http-equiv="X-UA-Compatible" content="IE=8" /> 

kludgy Feels, लेकिन वहाँ आप यह ... और लगातार काम करने लगता है।