الله يسلمك أخوي أبواب
والغيـاب ظروف أجبرتنـا لكن رجعنا لسوالف
ومشكلتك بإذن الله حلها بسيط , وبشرح لك الحل بشكل درس حتى يكون واضح وبدون غموض.
في البداية هذا كود البدي اللي راح نشتغل عليه:
كود:
<body>
<div id="wrapper"><!-- بداية ID والتحكم بالموقع -->
<div id="header"></div> <!-- هيدر الصفحة -->
<div id="content"></div> <!-- المحتوى "الوسط" -->
<div id="footer"></div> <!-- النهاية " الفوتر " -->
</div><!-- نهاية ID والتحكم بالموقع -->
</body>
1- حتى تتخلص من التباعد في الصفحة فوق الموقع وبالجوانب تضع خيار Body في CSS كالتالي:
كود:
body{
margin:0; <!-- هذا الخيار حتى تتخلص من التباعد -->
}
2- الأن الهيدر يكون بأول شيء وبعده يجي المحتوى ثم الفوتر ( هذا التسلسل المتعارف عليه )
كيف يكونون بهذا التسلسل دائماً لاحظ ترتيب الأكواد في كود البدي , ويكون خيار CSS كالتالي :
كود:
#wrapper {
background-color: #999999;
margin:0 auto; /* هذي الخاصية لتوسيط الموقع , وتقدر تستخدم الخاصيتين اللي بعدها للتوسيط لأن الأثنين يقومون بنفس العمل ولك الخيار */
margin-right:auto;
margin-left:auto;
width:840px; /* عرض 840 بكسل متعارف عليه , ولتمدد الموقع كامل الشاشة أستخدم 100% بدل 840 */
}
#header{
background:#333333;
height:62px;
}
#content{
background:#666666;
height:260px;
}
#footer{
background:#CCCCCC;
height:45px;
clear:both; /* حتى مايتأثر الفوتر بالمحتوى وللمزيد تابع موضوع الأخ فلاشر المثبت بالقسم */
}
جرب ماسبق وراح تلاحظ أنه بالوسط ومرتبة ( هيدر ومحتوى وفوتر ) وبدون تباعد.
وأي سؤال أنا حاضر