/ / शीर्षलेख और पाद लेख ओवरले सामग्री - बूटस्ट्रैप - एचटीएमएल, सीएसएस, ट्विटर-बूटस्ट्रैप, मीडिया-प्रश्न, ट्विटर-बूटस्ट्रैप -2

शीर्षलेख और पाद लेख ओवरले सामग्री - बूटस्ट्रैप - एचटीएमएल, सीएसएस, ट्विटर-बूटस्ट्रैप, मीडिया-प्रश्न, ट्विटर-बूटस्ट्रैप -2

मैं उपयोग कर रहा हूँ बूटस्ट्रैप कवर टेम्पलेट कुछ सामग्री के साथ एक स्वच्छ वेबसाइट बनाने के लिए: मूल रूप से कुछ पाठ और एक छवि।

शीर्षलेख और पाद लेख वेबसाइट सामग्री को ओवरले करना जैसा कि आप इस स्क्रीनशॉट में देख सकते हैं:

ट्विटर बूटस्ट्रैप

वेबसाइट: merdanacabeca.com/adrenalina/

इस मामले में सबसे अच्छा समाधान क्या है? मीडिया-प्रश्न?

मुझे पता है कि मैं सामग्री में शीर्ष मार्जिन जोड़ सकता हूं <div> और फिक्सर की स्थिति को स्थिर के बजाय स्थैतिक में बदलें। हालांकि, इससे विभिन्न स्क्रीन संकल्पों (उदाहरण के लिए छोटे) में अन्य समस्याएं होती हैं।

मैं सबसे अच्छा दृष्टिकोण तलाश रहा हूं।

उत्तर:

जवाब के लिए 0 № 1

समस्या .masthead और .mastfoot कक्षाओं की निश्चित स्थिति से निकला है।

.Mastfoot की निश्चित स्थिति को हटाने का प्रयास करें और masthead और .cover के लिए निम्न का प्रयास करें:

.masthead {
position: fixed;
top: 0;
background: #333333;
}

.cover {
padding: 0 20px;
margin-top: 115px;
}

जवाब के लिए 0 № 2

अगर मैं आपके प्रश्न को सही ढंग से समझ गया हूं, तो आप उस सफेद बटन को ओवरले करने से "Desenvolvido por ..." पाठ के साथ पाद लेख को रोकने की कोशिश कर रहे हैं (यदि सही नहीं है तो मुझे सही करें)।

ठीक है यह की वजह से है padding-bottom का .inner कक्षा है कि पाठ वहाँ खड़ा है। आप इसे कम कर सकते हैं ...

मुझे यह भी नहीं लगता कि आपको चाहिए position: fixed पाद लेख के लिए। आम तौर पर यह पृष्ठ के निचले हिस्से में रहता है।

आप भी असाइन कर सकते हैं margin-top को <div class="inner cover"> हेडर के साथ समस्या बनाने के लिए दूर जाना