/ / 100% ऊंचाई शरीर, पूर्ण बच्चा भी 100% लेने के लिए - एचटीएमएल, सीएसएस

100% ऊंचाई शरीर, पूर्ण बच्चा भी 100% लेने के लिए - एचटीएमएल, सीएसएस

मैं 100% ऊंचाई लेने के लिए एक पूर्ण स्थान तत्व बनाने की कोशिश कर रहा हूं body, कहा पे body 100% सामग्री लेने के लिए सेट है, जो अधिक हो सकता है window ऊंचाई। लेकिन, मैं इसे नाखुश प्रतीत नहीं कर सकता।

सीएसएस:

html
{
height: 100%;
}

body
{
min-height: 100%;
}

#push
{
padding-top: <to exceed window height>;
}

#absolute
{
position: absolute;

left: 0px;
top: 0px;

width: 100%; /* to take full width of body */

height: 100%; /* to take full height of body */
}

एचटीएमएल (मानते हुए कि यह सभी सामग्री भीतर है <body>):

<div id="push"></div>
<div id="absolution"></div>

बेला: http://jsfiddle.net/psycketom/DbV4R/

मैंने बनाने की कोशिश की है #absolute शरीर का पहला बच्चा, आखिरी बच्चा (मानते हुए कि डोम ने अभी तक शरीर की शुरुआत में ऊंचाई की गणना नहीं की है)। इसके अलावा, इसे हटाने की कोशिश की height बदले में संपत्ति top: 0; bottom: 0; - कोई भाग्य नहीं।

खैर, मुझे लगता है कि यह "के कारण है absolute से तत्व लेता है दस्तावेज़ का प्रवाह, लेकिन, इसके आसपास कोई रास्ता नहीं है?

मेरा वास्तविक उदाहरण यह है कि मैं एक पूर्ण स्थानित पृष्ठभूमि अनुलग्नक तत्व रखना चाहता हूं जिसमें कई बिल्कुल स्थित तत्व हैं। तत्व होने जा रहा है overflow: hidden कोई स्क्रॉलबार नहीं बनाने के लिए।

जावास्क्रिप्ट और परिभाषित ऊंचाई को छोड़कर, मेरे पास कौन से विकल्प हैं?

अद्यतन करें:

यदि आप बेवकूफ का निरीक्षण करते हैं, तो आप उसे नोटिस करेंगे #absolution ऊंचाई में 536 पीएक्स लेता है, जहां शरीर 600 लेता है।

मुझे चाहिए, #absolution, 600px लेने के लिए - पूर्ण ऊंचाई body.

उत्तर:

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

शरीर की स्थिति को सापेक्ष बनाओ? सभी लाल से छुटकारा पाने के लिए शरीर के लिए देशी मार्जिन / पैडिंग निकालें (http://jsfiddle.net/DbV4R/6/)

http://jsfiddle.net/DbV4R/5

body {
position: relative;
}