PDA

View Full Version : مبتدی: چرا این Div میره خط بعدی قرار نمی گیره؟



shahab_ksh
دوشنبه 22 آبان 1391, 10:10 صبح
با سلام

کد زیر رو در نظر بگیرید




<div id="div_left" style="width: 200px; float: left" ></div>
<div id="div_center" style="width: 300px; margin-right: auto; margin-left: auto" ></div>
<div id="div_right" style="width: 300px; float: right" ></div>



حالا دو سوال دارم

1- چرا دو div اول در یک راستا هستن اما div سوم یک خط پایینتر افتاد
2- اگه بخواهم کاری کنم که div وسط هر چقدر اومد پایین div سمت راست هم همین اندازه پایین بیاد باید چیکار کنم

Saber Mogaddas
دوشنبه 22 آبان 1391, 12:57 عصر
سلام
چون 3 دیو شما دارای عرض ثابت هستند ابتدا :
هر سه دیو رو داخل یک دیو اصلی با مجموع عرض 3 دیو قرار میدهیم . (800px)
در هر صورت باید یک دیو اصلی قرار بدهید.
برای سوال دوم نیز به این تاپیک (http://barnamenevis.org/showthread.php?367879-%D9%85%D8%B4%DA%A9%D9%84-%D8%A8%D8%A7-div-%D9%87%D8%A7) نگاه کنید.
موفق باشید..

shahab_ksh
دوشنبه 22 آبان 1391, 13:51 عصر
با سلام

عرض رو ثابت کردم و داخل یک دیو قرار دادم اما باز مشکل حل نشد.



<div style="width: 1000px">
<div id="div_left" style="width: 200px; float: left" ></div>
<div id="div_center"
style="width: 20%; margin-right: auto; margin-left: auto;" ></div>
<div id="div_right" style="width: 300px; float: right" ></div>
</div>

Saber Mogaddas
دوشنبه 22 آبان 1391, 18:45 عصر
سلام
دوست عزیز چون عرض ثابت هست نیاز نیست margin:auto رو برای دیو وسط اعمال کنیم.

#Wraper
{
width: 1000px;
margin:auto;
}
#div_left
{
width: 200px; float: left;
background-color:#000;
min-height:100px;
}
#div_center
{
background-color: #000000;
float: right;
margin-right: 145px;
min-height: 100px;
width: 20%;
}
#div_right
{
width: 300px; float: right; background-color:#000;min-height:100px;
}



<div id="Wraper">
<div id="div_right"></div>
<div id="div_center"></div>
<div id="div_left"></div>
</div>


موفق باشید.

shahab_ksh
دوشنبه 22 آبان 1391, 23:52 عصر
مرسی میشه بگید در #div_center



margin-right: 145px;


این عدد رو چطور بدست آوردین چون طول دیو ثابت بود این رو بصورت تجربی بدست آوردین آگه درصدی باشه چی؟

Saber Mogaddas
سه شنبه 23 آبان 1391, 19:14 عصر
سلام
عدد 145 رو به صورت نظری دادم ، ولی اگه div-center دارای عرض px ای باشه با یک فرمول ساده مقدار margin رو بدست میاریم..
دیو سمت راست و چپ و وسط رو باهم جمع می کنیم و منهای عرض دیو اصلی می کنیم و در نهایت تقسیم بر دو می کنیم و عدد مورد نظر.
موفق باشید..