قرار دادن div ها کنار هم

[havash.link]

با عرض سلام خدمت اساتید محترم

در مورد کار با div ها سوال داشتم .

می خواستم سه تا div رو کنار هم قرار بدم ، به این صورت

div 1 - div 2 - div 3

بطوری که div وسط با اندازه ثابت 1000px ولی div های کناری به اندازه ای باشه که" div 1 " از سمت چپ و" div 3" از سمت راست پنجره رو پر کنه و با تغییر اندازه پنجره سایز div های کناری ( div 1 - div 3) تغییر کنه
با تشکر

[ms1987]

سلام
برای div های 1 و 3 کافیه مقدار float رو left و right تعیین کنی و برای div وسط هم کافیه یه مقدار به float بدی و متناسب با اون از margin-left و margin-right استفاده کنی. برای تعیین عرض divهای 1 و 3 هم باید مقدار width را بصورت درصد تعیین کنی.البته اگر widthمربوط به div وسط رو ثابت بگیری ممکنه در زمان تغییر اندازه دادن پنجره صفحه بهم بریزه .


<div style="float:right; width:20%; height:100px; background-color:blue" ></div>
<div style="float:right; width:800px; height:100px; background-color:green; margin-right:5px;margin-left:5px" ></div>
<div style="float:left; width:20%; height:100px; background-color:fuchsia"></div>

[رضا قربانی]

یک div کلی با 100% عرض بده و سه div دیگه رو داخلش بذار به طوری که دو div گوش درصد باشن و div وسطی 1000پیکسل . تا بهم نخوره

[ERIKA]

سلام
اگر بخواهیم دیو وسطی به عنوان بک گراند کار قرار بگیره و دو تا دیو دیگر در سمت چپ و راست ان قرار گیرد باید چکار کرد؟
من اینطوری نوشتم ولی توی بروزر های مختلف یا اگر صفحه کوچک (مینیمایز) شود به هم ریختگی پیدا می کند.




.header
{
width:100%;
}
.leftbaner
{
width:250px;
float:left;

height:100px;
position:absolute;
left:182px;top:25px;


}
.rightbaner
{
width:250px;position:absolute;
float:right;height:100px;


top:25px;
right: 177px;

}



<div class="header">
<div class="rightbaner"> </div>


<div class="logo">

</div>


<div class="leftbaner"> </div>
</div>

[khanlo.javid]

سلام
برای div های 1 و 3 کافیه مقدار float رو left و right تعیین کنی و برای div وسط هم کافیه یه مقدار به float بدی و متناسب با اون از margin-left و margin-right استفاده کنی. برای تعیین عرض divهای 1 و 3 هم باید مقدار width را بصورت درصد تعیین کنی.البته اگر widthمربوط به div وسط رو ثابت بگیری ممکنه در زمان تغییر اندازه دادن پنجره صفحه بهم بریزه .


<div style="float:right; width:20%; height:100px; background-color:blue" ></div>
<div style="float:right; width:800px; height:100px; background-color:green; margin-right:5px;margin-left:5px" ></div>
<div style="float:left; width:20%; height:100px; background-color:fuchsia"></div>





یه نکته به پاسخ دوستان اضافه میکنم که نقطه حساسی هم هست تو طراحی با دیو ها اونم اینه که باید بعد از استفاده از float در دیو ها اونو clear کنید تا طرح به درستی از آب در بیاد ، که تمامی دوستان یادشون رفته این نکته رو رعایت کنن.


<div style="clear:both"></div>



موفق باشید.