چي كار كنم تا بخش پاورقي سر جاش قرار بگيره؟

[CATY_minasian]

سلام دوستان
واسه صفحات يه div واسه footer گذاشتم ولي مشكل داره:
- اگر محتواي صفحه ارتفاعي بيشتر از ارتفاع پنجره مرورگر داشته باشه كه مشكلي نيست ولي اگر محتواي صفحه، ارتفاعي كمتر از پنجره مرورگر داشته باشه، بخش پاورقي از پايين صفحه جدا شده و به سمت بالا حركت ميكنه و زير محتواي صفحه قرار ميگيره. براي حل اين مشكل من اين كارو انجام دادم:


#footer


{


Position:absolute;


Bottom:0;


…

{
اما با اين كار بخش پاورقي به سمت بالا حركت ميكنه و وسط صفحه قرار ميگيره.
من دنبال دو تا موضوعم:

يكي اينكه بخش پاورقي در پايين سند قرار بگيره نه در پايين پنجره مرورگر

و ارتفاع سند بايد حداقل به اندازه ارتفاع پنجره مرورگر باشه.
تو يه كتاب خوندم كه براي "رسيدن به هدف اول تنها كافيست كه بخش پاورقي را در داخل يك برچسب div قرار دهيد و سبك css خاصي را براي اين برچسب در نظر گرفته و position:absolute را به آن اختصاص دهيد. با اين كار بخش پاورقي به جاي اينكه در پايين پنجره مرورگر قرار بگيرد به پايين سند مي چسبد."
يعني يه div ميذاريم با خصوصيات زير و داخل اين div يه div ديگه واسه فوتر تعريف مي‌كنيم.


#content


{


Position:absolute;


Top:0;


Left:0;


}
و براي دستيابي به هدف دوم يه طوري كه براي همه مرورگرها كار كند بايد خصوصيات زير را اضافه كنبم به فايل css.


Html,body, #content


{


Min-height:100%;


Width:100%;


Height:100%;


}


Html>body, html>body #content


{


Height:auto;


}






اين كارارو انجام دادم ولي بازم مشكلم حل نشد

كسي ميدونه واسه اينكه فوتر سر جاش قرار بگيره بايد چي كار كنم.
ممنون

[emad_67]

احتمالا یه جایی اشتباه می کنی.
کدت رو کامل بزار تا چک کنم.

[CATY_minasian]

ممنون باشه حتمامیذارم

[hosseinkhosravi]

گزینه clear:both; را به مشخصات footer اضافه کن. این باعث میشه که footer از چپ و راست به کناره های صفحه بچسبه و چون تا قبل از انتهای صفحه، مانع وجود دارد، به انتهای صفحه میره!:تشویق:

[CATY_minasian]

از پاسخ همه دوستان ممنون.
این روش هارو تست کردم ولی در IE7و IE8 هنوز همون مشکلو داره.
کداشو میذارم اگه کسی میتونه کمکم کنه
بازم ممنون

[emad_67]

در خصوصیات مربوط به basic خصوصیت position رو absolute در نظر بگیرید.

[CATY_minasian]

ممنون
امتحان میکنم

[CATY_minasian]

position:absolute صفحه رو به هم میریزه.من میخوام دیوی که هیدیش basic هستش وسط صفحه باشه واسه همین relative گذاشتم.پیشنهاد دیگه ای ندارین؟

[emad_67]

برای کاری که شما می خواین بکنید باید position: absolute باشه، در غیر این صورت نمیشه height رو به صورت درصدی در نظر گرفت.
راه دیگه اینه که می تونید مقدار عرض #basic رو به صورت درصدی بدید، و بعد اون رو با تراز کنید.
مثلا:


#basic
{
position: absolute;
top: 0;
left: 10%;
width: 80%;
border-bottom: solid 2px #722100;
border-left: solid 2px #722100;
border-right: solid 2px #722100;
}
در این مثال من 80% عرض رو در نظر گرفتم و از 20 درصد باقی مانده 10 درصد اون برای فاصله از چپ قرار دادم تا عنصر وسط بیفته.