2013-12-09 16 views
17

मैं यहाँ एक लेआउट बनाने के लिए है, जिसमें ऐसा दिखाई देता है कोशिश कर रहा हूँ की तह तक एक div छड़ी बनाओ अनुभाग। [stream-content] नामक एक अतिरिक्त अनुभाग है, यदि वहां (केवल होम पेज पर होगा) को footer से पहले स्थिति लेनी होगी। और उस स्थिति में, content अनुभाग को header और stream-content अनुभाग के बीच स्थान लेना चाहिए। मैंने पूर्ण स्थिति के साथ ऐसा करने की कोशिश की लेकिन मेरे सभी तत्व खराब हो रहे थे, इसलिए ऐसा करने का सही तरीका समझना चाहता था। सभी मदद के लिए अग्रिम धन्यवाद!माता पिता

+0

आप हमेशा अपने div की ऊंचाई को पर्सेंट में बना सकते हैं। शीर्षलेख 5%, शरीर 90%, पाद लेख 5%। मुझे यकीन नहीं है कि क्या पर्सेंट फेंक रहे हैं, लेकिन इसे काम करना चाहिए। –

+0

[यह मदद कर सकता है] (http://jsfiddle.net/peteng/9DLeg/) - सामग्री को स्ट्रीम करें और सामग्री को मध्य भाग – Pete

उत्तर

30

अपने wraper वर्ग के लिए position:relative जोड़ें। स्ट्रीम-सामग्री कक्षा में position:absolute;bottom:0; जोड़ें।

इसे यहां देखें। Fiddle

+0

अरे धन्यवाद। लेकिन मैंने लाल फूटर को देखा जो मैंने सोचा था कि चिपचिपा भी नीचे जा रहा है जब मैं 'सामग्री' अनुभाग में बहुत कुछ जोड़ता हूं। मैंने उस चिपचिपा फूटर को सीएसएस-ट्रिक्स पर देखकर बनाया था http://css-tricks.com/snippets/css/sticky-footer/ लेकिन अब यह काम कर रहा है। क्या ऐसा कुछ है जो मुझे याद आया? कुछ मदद पाने के लिए बहुत अच्छा होगा। – user1240679

+0

तो क्या आप चाहते हैं कि यह ब्राउज़र के नीचे या कुरकुरा के तल तक टिके? –

+4

इसमें रैपर के साथ कुछ लेना देना नहीं है। 'निश्चित 'स्थिति स्क्रीन के व्यूपोर्ट से संबंधित है, न कि तत्व के माता-पिता। –

0

यदि मैं सही ढंग से समझता हूं तो इसे करने का एक तरीका रैपर के बाहर [स्टीम सामग्री] डालना होगा, क्योंकि रैपर वह है जो नीचे की ओर पैरर रखता है। आप [भाप सामग्री] आवरण के अंदर होना आवश्यक है, तो आप तल पर एक साथ रखने के लिए पाद लेख के साथ इस http://ryanfait.com/sticky-footer/ की तरह कुछ कोशिश कर सकते हैं

+0

लिंक टूटी हुई है। मैं एक संग्रहित संस्करण खोजने की कोशिश करता हूं लेकिन यह robots.txt अनुक्रमण को अस्वीकार करता है। प्रतिक्रिया के लिए – carefulnow1

संबंधित मुद्दे