लाइन-ऊंचाई आधार रेखा को ऑफ़सेट कैसे करें?

Question

font-face के साथ यह बहुत आम समस्या है, उदा।

font: 20px/20px 'ITC Avant Garde Gothic Std'; font-style: 'book'; letter-spacing: 1px; text-transform: uppercase; 

समस्या यह है कि मैं उम्मीद थी पाठ लंबवत रूप से केंद्रित है। हालांकि, यह नहीं है। लाइन-ऊंचाई बेस लाइन ऑफसेट करने का कोई तरीका है? वास्तव में line-height को बदले बिना।

Answer 1

घटना फ़ॉन्ट पर निर्भर करती है। यह तय करने के लिए फ़ॉन्ट डिजाइनर पर निर्भर करता है कि फ़ॉन्ट इसकी ऊंचाई का उपयोग कैसे करता है। उदाहरण के लिए एरियल में, ठोस सेट करते समय, अपरकेस मूल लैटिन अक्षरों को लंबवत केंद्रित किया जाता है, जबकि वर्दान में, वे थोड़ा कम दिखाई देते हैं (यानी, नीचे से थोड़ा अधिक स्थान)।

आप रिश्तेदार स्थिति का उपयोग करके इसे ठीक-ठीक कर सकते हैं, लेकिन फिर आपको अतिरिक्त मार्कअप की आवश्यकता है, उदा।

<div><span>text</span></div> 

span की स्थापना, कहते हैं के लिए सीएसएस के साथ

,

position: relative; 
top: 2px; 

यह बुरा प्रभाव के कारण हो सकता है, तो उपयोगकर्ता के ब्राउज़र में प्रयुक्त फ़ॉन्ट आपकी अपेक्षाओं से अलग है।

मैंने font-style: 'book' के संभावित प्रभाव पर विचार नहीं किया, क्योंकि मुझे पता नहीं है कि इसका क्या अर्थ हो सकता है। कोई सीएसएस संसाधन मुझे पता नहीं है कि कुछ भी इस तरह का उल्लेख करता है (font-style मूल्य अनजान कीवर्ड हैं और book में शामिल नहीं हैं)।