चिपचिपा हैडर कवर एंकर टेक्स्ट

Question

मेरे पास एक चिपचिपा शीर्षलेख है जो शेष पृष्ठ पर तैरता है। जब मैं पेज एंकर से लिंक करता हूं, निश्चित रूप से स्क्रॉल होता है ताकि एंकर पृष्ठ के शीर्ष पर हो। हालांकि, जब ऐसा होता है तो हेडर नीचे दिए गए पाठ को कवर करता है।

क्या इसे ठीक करने के लिए कोई रास्ता है? मैं सिर्फ एंकर को नीचे नहीं ले जा सकता क्योंकि उनमें से कई पृष्ठ पर हैं और प्रत्येक के पास एक अलग मात्रा में पाठ है। मेरा पहला हालांकि किसी भी तरह एंकर से ऊपर कुछ ऊंचाई तक स्क्रॉल करना था।

धन्यवाद, डेविड

Answer 1

: लक्ष्य छद्म तत्व हो सकता है आप के लिए क्या देख रहे हैं। इसके साथ: लक्ष्य आप उस तत्व को संबोधित कर सकते हैं जो # -mark के साथ इंगित किया गया है। और अधिक पढ़ें के बारे में यह here

Answer 2

मैं एक ही मुद्दे में भाग गया, बनाने समाप्त हो गया इस तरह एक नियम:

A.named:target { 
    display: inline-block; 
    height: 120px; 
    margin-top: -120px; 
} 

मैं तो किसी भी एंकर टैग है कि मैं ब्राउज़र चाहते स्क्रॉल करने के लिए करने के लिए वर्ग "नाम" लागू किया सेवा मेरे। यह ब्राउज़र के शीर्ष के बीच 120px स्पेस और उस तत्व के निचले हिस्से को जोड़ता है जिसमें एंकर के लिए लगभग 80px है, और H2 शीर्षकों की ऊंचाई की क्षतिपूर्ति करने के लिए एक और 40px मैं लिंक कर रहा था ... और, साथ ऋणात्मक मार्जिन सकारात्मक को रद्द कर रहा है, यह मेरे पेज के स्वरूप को प्रभावित नहीं करता है।

आशा है कि इससे मदद मिलती है!