@page: क्रोम बग में पहला {मार्जिन: ...}?

Question

पर पूर्ण बेला का जिक्र करते हुए: http://jsfiddle.net/XT92a/

@page { 
    margin: 1in; 
} 

@page :first { 
    margin: 2in 1in 3in 3in; 
} 

मैं ऊपर शासन करने के लिए पहले मुद्रित पृष्ठ निश्चित मार्जिन है और अन्य सभी पृष्ठों 1 इंच मार्जिन राशि की उम्मीद है।

इसके बजाय, मुझे क्रोम के प्रिंट पूर्वावलोकन (मुद्रित आउटपुट के लिए सटीक) में निम्न मिलता है। मार्जिन गैर-पहले पृष्ठों पर अलग हैं, लेकिन वे सही नहीं हैं। :first margin नियम पर टिप्पणी करने से गैर-प्रथम पृष्ठ सही लेआउट के साथ प्रिंट करने की अनुमति देता है, लेकिन बेशक, पहला पृष्ठ भी प्रभावित होता है।

Mozilla's documentation मुझे लगता है कि क्रोम यह ठीक से समर्थन करता है। और स्पष्ट रूप से क्रोम प्रतिक्रिया करता है, लेकिन सही ढंग से नहीं। अगर मैं कर सकता था तो मैं क्रोम दस्तावेज़ों का संदर्भ दूंगा, लेकिन Google दस्तावेज पर बेकार है! (वहाँ MDN की एक गूगल बराबर है? मैं यह नहीं मिल सकता है।)

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

क्या मैं इसे गलत कर रहा हूं? क्या कोई मजबूत कामकाज है? मैंने @page:first (कोई स्थान नहीं) की कोशिश की है, मार्जिन मानों को स्वतंत्र रूप से trbl शैली और व्यक्तिगत रूप से सेट किया है, और स्टाइल घोषणाओं में नियमों के क्रम को बदल दिया है। कोई प्रभाव नहीं।

Answer 1

आप ने कहा:

मोज़िला प्रलेखन दावा करता है कि क्रोम इस ठीक से समर्थन करता है, मुझे लगता है।

यह सच है, लेकिन the :first CSS pseudo-class क्रोम से अज्ञात समर्थन से पता चलता ("अज्ञात समर्थन करते हैं। कृपया इस अद्यतन करें।"

Also, there are many print preview issues with Chrome और मैं कुछ है कि इस समस्या के लिए इसी तरह लग रहा था such as this one भर में ठोकर खाई। फिर भी, मैं कोई काम नहीं मिल सकता है । arounds जैसा कि आप अपने खुद के परीक्षण मैंने कोशिश में जानते हैं:

• नकारात्मक हाशिए
• गद्दी के बजाय मार्जिन
• बड़े सीमाओं मार्जिन
अनुकरण
• forced page breaks (संभव हैक समाधान)
• स्पष्ट width और height
• !important

मैं परीक्षण का एक बहुत प्रदर्शन किया और क्रोम उपेक्षा या अनुचित तरीके से सीएसएस लागू करने के लिए प्रकट होता है पूर्वावलोकन पीडीएफ फ़ाइल उत्पन्न करते समय नियम। व्यक्तिगत रूप से, मेरे परीक्षण परिणामों से, मुझे लगता है कि यह एक बग है।

अद्यतन

• फ़ायरफ़ॉक्स v17.0।1 - @page नियम लागू नहीं करता है।
• क्रोम 23.0.1271.97 मीटर - सभी पृष्ठों पर :first छद्म वर्ग को गलत तरीके से लागू करता है।
• आईई 9.0.8112.16421 - क्रोम

मेरे निष्कर्ष browser compatibility chart on the :first pseudo class page के साथ मेल खाना के रूप में नियमों का एक ही दुरुपयोग करता है। यही है, क्रोम के लिए अज्ञात संगतता और फ़ायरफ़ॉक्स के लिए "समर्थित नहीं" संगतता। मैं IE8 का परीक्षण करने में असमर्थ था, लेकिन IE9 के साथ मेरा परीक्षण चार्ट के दावे का समर्थन नहीं करता है। यहां तक ​​कि माइक्रोसॉफ्ट के उदाहरण भी सही ढंग से प्रस्तुत करने में विफल रहते हैं (CSS How-to: Optimize Pages for Printing Using CSS)।

अधिक परीक्षण के बाद, मैं केवल निष्कर्ष निकाल सकते हैं कि @page पूरी तरह से अधिकांश ब्राउज़र में एकीकृत किया गया है। विनिर्देश मौजूद हैं (there are new specs. for CSS3) लेकिन हमारे परीक्षणों के आधार पर, लेखों में परीक्षण किए गए उदाहरणों की कमी, और बग रिपोर्ट्स ऐसा लगता है कि आप @page स्टाइल के अधिक लचीले चश्मे का सफलतापूर्वक उपयोग नहीं कर पाएंगे।

Answer 2

समाधान जो मेरे मामले में काम करता था और सभी मार्जिन को सभी पृष्ठों में समान बना देता था। इससे पहले, पहला पृष्ठ बड़ा मार्जिन देने के लिए प्रयोग किया जाता था। मार्जिन-टॉप का उपयोग करने के बजाय: 20px पैडिंग-टॉप का उपयोग करें: ब्लॉक में 20px जो पृष्ठ div में पहले जा रहा है। यह हो सकता है

काम करता है:

header { 
    margin:0px 80px 20px 80px; 
    padding-top:50px; 
} 

नहीं काम कर (पहले पृष्ठ पर बड़ा ऊपरी हाशिया देता है): first` विशेष पेज:

header { 
    margin:50px 80px 20px 80px; 
}