Div و چيدمان عناصر صفحه

[Reza_Yarahmadi]

سلام به همه دوستان
من قصد دارم صفحه رو بخش بندي كنم و ابزارهام رو توي اونها بذارم (تصوير ضميمه) توي اين كار هم فقط ميخوام از تگ div استفاده كنم ولي نميدونم چرا هر كاريش ميكنم نميشه!!
با Table به راحتي ميشه اين كار رو كرد ولي ميخوام تمامش با div باشه.
كد زير رو نوشتم ولي جواب نميده.
دوستان اگه لطف كنند و راهنماييم كنند كه كجا مشكل دارم ممنون ميشم.
<div>
<div style="padding: 0px;
margin: 0px;
height: 280px;
width:100%;
background-image:url(images/LeftHeader.jpg);
background-repeat:no-repeat;
background-position:0px 0px;">

<div style="padding: 0px;
margin: 0px;
height: 280px;
background-image:url(images/RightHeader.jpg);
background-repeat:no-repeat;
background-position:right;">

</div>
<div id="loginbox">
</div>
<div id="themeselector">
</div>
<div id="languageselector">
</div>
</div>


<div style="width:100%;">
<div style="margin-right:279px;
float:left;
background-color:#F1FAE9;">

<div style="float:left;
padding: 0px;
margin: 0px;
width: 85px;
background-color:White;
background-image:url(images/MainLeftTopBorder.jpg);
background-repeat:no-repeat;
background-position:right;">
</div>

<div style="padding: 0px;
margin: 0px;
background-color:#F1FAE9;
float:none;">
</div>
</div>
<div style="float:right;
padding: 0px;
margin: 0px;
width: 279px;
background-image:url(images/MainRight.jpg);
background-repeat:repeat-y;
background-position:top;">

<div style="padding: 0px;
margin: 0px;
height: 81px;
width: 279px;
background-image:url(images/MainRightTop.jpg);
background-repeat:no-repeat;
background-position:100% 0px;"></div>
<div style="padding: 0px;
margin: 0px;
width: 279px;
background-image:url(images/MainRight.jpg);
background-repeat:repeat-y;
background-position:right;">
<div class="Menu" id="Menu1">
لينك شماره 1
</div>
<div class="Menu" id="Menu2">
لينك شماره 2
</div>
<div class="Menu" id="Menu3">
لينك شماره 3
</div>
<div class="Menu" id="Menu4">
لينك شماره 4
</div>
<br />
<br />
</div>
<div style="padding: 0px;
margin: 0px;
height: 116px;
width: 279px;
background-image:url(images/MainRightBottom.jpg);
background-repeat:no-repeat;
background-position:right;"></div>
</div>
</div>

<div style="padding: 0px;
margin: 0px;
height: 245px;
width:100%;
vertical-align:bottom;">

<div style="padding: 0px;
margin: 0px;
float:left;
height: 245px;
width:40px;
background-image:url(images/FooterLeft.jpg);
background-repeat:no-repeat;
background-position: 0px 213;">
</div>

<div style="padding: 0px;
margin: 0px;
background-image:url(images/Footer.gif);
background-repeat: repeat-x;
background-position:left;">
</div>

<div style="float:right;
padding: 0px;
margin: 0px;
height: 245px;
width: 960px;
background-image:url(images/FooterRight.jpg);
background-repeat:no-repeat;
background-position:right;">
</div>
</div>
</div>

[xoogle.ir]

اگر میخواهید که اون div وسطتون با تغییر رزولیشن کشیده بشه باید عناصر چپ و راستش رو float به طرفین بکنید تا اون div وسطتون بره زیر بعد بهش margin بدین تا فاصله اش از 2 طرف تنظیم بشه.
استایل هاتون رو هم این جوری ننویسید برای هر div یک کلاس تعریف کنید و فایل استایلتون رو به صورت خارجی تعریف کنید.

[mastermehdi1]

دوست عزیز این کدی که من میبینم کلا div هست
شما کدی که میگی table داره رو بزار تا بگم چطوری divیش کنی
در کل با کدی که گذاشتی اصلا نمیشه فهمید مشکلت کجاست

موفق باشی

[Reza_Yarahmadi]

ممنون از توجهتون
تصوير صفحه اي كه نياز داشتم رو گذاشتم ، مشكلي كه داشتم اين بود كه Div هاي Sizable به هم وابسته بودند و در صورت تغيير اندازه هر كدوم بقيه هم بايد تغيير ميكرد.
به نظرم با كد html بايد بشه همچين كاري كرد ولي چون به نتيجه اي نرسيدم مجبور شدم متوسل به javascript بشم و با اون تغيير سازها رو هندل كنم.