ورود

View Full Version : کنار هم گذاشتن دو دیو


Hossis
جمعه 09 مرداد 1388, 17:05 عصر
چطوری میشه دو اهریمن (منظورم همون دیو div هست) رو به صورت افقی کنار هم گذاشت
من هر کار کردم نشد چون همشون عمودی چیده می شند
mostafa_shaeri_tj
جمعه 09 مرداد 1388, 21:38 عصر
باید align یکی رو right و دیگری رو left قرار بدی. در ضمن مجموع عرض دو تا div نباید بیشتر از عرض body بشه .

موفق باشی
fumnimda
جمعه 16 مرداد 1388, 00:46 صبح
باید align یکی رو right و دیگری رو left قرار بدی. در ضمن مجموع عرض دو تا div نباید بیشتر از عرض body بشه .

موفق باشی

منظورتون از align چیه؟ به نظر من بهترین راه float کردن این دو div یا هر n تا عنصر بلاک هست برای کنار هم قرار دادنشون.
benyaminj
شنبه 17 مرداد 1388, 05:30 صبح
منظورتون از align چیه؟ به نظر من بهترین راه float کردن این دو div یا هر n تا عنصر بلاک هست برای کنار هم قرار دادنشون.
شما بايد از مقدار float استفاده کنی..يعنی اگه 2 تا دايو ميخوای کنار هم باشن بايد بهشون مقدار float:left يا right بديد.
farnooshhp
شنبه 17 مرداد 1388, 08:42 صبح
برای دیوی که میخواهید در سمت راست قرار گیرد : float: right
برای دیوی که می خواهید سمت چپ قرار گیرد : float: left
mehr83
یک شنبه 18 مرداد 1388, 17:42 عصر
من از دات نت 2008 استفاده می‌کنم با این توضیحات نتونستم دوتا دیو را در کنار هم قرار بدم خاصیت float نداره
با Align هم نشد میشه بیشتر توضیح بدید
mehr83
یک شنبه 18 مرداد 1388, 21:36 عصر
من اینکارو انجام دادم اما float پیدا نمی‌کنم. بصورت عمودی کنار هم قرار می‌گیرند
mostafa_shaeri_tj
دوشنبه 19 مرداد 1388, 15:02 عصر
من با align کار کردم و جواب گرفتم. نمی دونم شما کجا مشکل دارین.
احتمال میدم مشکل شما تو بزرگ بودن div هاتون هست.
یعنی اگر div ها تون تو div دیگه ای هست, نباید مجموع عرضشون بزرگتر از عرض div ی باشه که توش قرار دارن.
Hossis
پنج شنبه 22 مرداد 1388, 09:57 صبح
با سلام
از همه دوستان که نظریه float رو مطرح کردند متشکرم
نمی دونستم کار این قدر راحته !! اونقدر با این اهریمن ها کلنجار رفتم از آخری با یک فلوت درست شد!!
armintirand
شنبه 31 تیر 1391, 21:52 عصر
سلام
منم در ساخت صفحاتم معمولا با این مشکل مواجه میشم ولی وقتی با float:right و اندازه width:20% برای یکی و دیگری 70% قرار میدم و 10% هم برای فاصله بینشون قرا میدم توی فایرفاکس خیلی قشنگ نشون میده ولی توی اینترنت اکسپلورر فقط در حالت فول اسکرین درسته ولی وقتی از فول اسکرین به حالت کوچکتر میره دایوها به صورت عمودی زیر هم چیده میشن در حالی که درصد دادم و باید به اندازه درصد کوچیک بشن ولی نمیشن به نظرتون مشکل از کجاس؟
ممنون
Saber Mogaddas
دوشنبه 02 مرداد 1391, 11:30 صبح
سلام
شما باید تاپیک جدید برای سوالتون ایجاد می کردید من این تاپیک رو منقضی شده می دونستم و از زیر دستم در رفته بود در هر صورت مت همه تاپیک ها رو خوندم فقت یکی از دوستان جواب درست داده بود که باید تو یه دیو اصلی قرار بدیدم.
خوب ما می خواهیم دو دیو زیر هم با فاصله 10px بینشون ایجاد کنیم که ارتفاع اونها نسبت به محتواشون متغیر باشه برای اینکار از یه دیو اصلی با استایل زیر :

.Wraper
{
width:300px;
min-height:10px;
overflow:hidden;
margin:0 auto;
}

این دیو رو در وسط و با طول متغیر ایجاد کرده ام. توجه کنید این دارای عرض ثابت هست
خوب حالا دو دیو رو داخل این دیو اصلی ایجاد می کنم و برای هر دو نام کلاس یکسان با استایل زیر می دم :

.Div1
{
width:300px;
min-height:100px;
float:right;
background-color:Olive;
margin-bottom:10px;
}

همانطور که مشاهده می کنید طول متغیر ور در حالت عادی 100px هست و نسبت به محتوا تغییر می کنه و توجه کنید که عرض نیز مساوی با عرض دیو اصلی یعنی 300px هست.
در نهایت به این صورت :


<html>
<head>
<title></title>
<style type="text/css">
*
{
margin:0;
padding:0;
}
.Wraper
{
width:300px;
min-height:10px;
overflow:hidden;
margin:0 auto;
}
.Div1
{
width:300px;
min-height:100px;
float:right;
background-color:Olive;
margin-bottom:10px;
}
</style>
</head>
<body>
<div class="Wraper">
<div class="Div1"></div>
<div class="Div1"></div>
</div>
</body>
</html>
خوب حالا اگه عرض دیو اصلی بنا به شرایط بزرگتر از دیو های داخلی بود یعنی دو برابر عرض دیو های داخلی بوده و به دلیل اینکه float :right دادیم در کنار هم به صورت عمودی باشند در این صورت به دیو اولی استایل بالا و به دیو دومی که باید به صورت افقی در پایین دیو اولی قرار بگیرد clear :right رو اضافه می کنیم ، به صورت زیر :


<html>
<head>
<title></title>
<style type="text/css">
*
{
margin:0;
padding:0;
}
.Wraper
{
width:600px;
min-height:10px;
overflow:hidden;
margin:0 auto;
}
.Div1
{
width:300px;
min-height:100px;
float:right;
background-color:Olive;
margin-bottom:10px;
}
.Div2
{
width:300px;
min-height:100px;
float:right;
background-color:Olive;
margin-bottom:10px;
clear:right;
}
</style>
</head>
<body>
<div class="Wraper">
<div class="Div1"></div>
<div class="Div2"></div>
</div>
</body>
</html>
موفق باشید..
armintirand
دوشنبه 02 مرداد 1391, 23:03 عصر
دوست عزیز منظور من چیز دیگه ای بود شاید درست بیان نکردم که شما مطلب دیگه ای قرار دادید.به این لینک در مرورگر اینترنت اکسپلورر در حالت فول اسکرین و حالت غیر فول اسکرین نگاه کنید.
http://urumlug.ir/index.php
همانطور که می‌بینید در حالت فول اسکرین همه چیز درست است اما وقی از فول اسکرین خارج می‌شویم همه دایوها عمودی زیر هم قرار می‌گیرند که ما نمیخواهیم اینطور شود.
بازم از توجهتون ممنون
Saber Mogaddas
سه شنبه 03 مرداد 1391, 09:43 صبح
سلام
مشکل سایتی که ضمیمه کردید داده عرض اونه به این صورت که برای همه width ها از % استفاده شده حتی دیو اصلی..که کار درستی نیست فقط برای طراحی موبایل از این شیوه البته کمی متفاوت تر استفاده میشه..
برای حل مشکل باید داده های درصد رو به px تغییر بدید..که میتونید دیو محتوای اصلی رو از عرض 980 تا 1007 پیکسل بگیرید که در این صورت تو تمامی رزلوشن ها به درستی جواب میده..
نه اگه شما قصد دارید تا صفحه تمام صفحه نمایش داده شه مثل سایت برنامه نویس می تونید به body یا یه دیو کلی به صورت زیر استایل بدید :

min-width: 960px; width: auto;

این دستور یعنی چی ؟
یعنی عرض من اتوماتیک باشه و تا جایی که جا داره بزرگ شه (منظور از تا جایی که جا داره تا دیواره های راست و چپ مرورگر هست ) و با دستور min-height یه طور شرط می زاریم که حداکثر کوچک شدن ایت تگ زمان کوچک کردن مرورگر 960px باشه و اضافتر کوچک نشه که باعث به هم خوردگی محتوای ما بشه..960 یک مثال هست شما با توجه به محتواتون این عدد رو تغییر بدید..
موفق باشید..
armintirand
سه شنبه 03 مرداد 1391, 15:10 عصر
علت درصد دادنم بخاطر اینه که می‌خوام تو مونیتورهای با اندازه‌های مختلف کامل درست نشون داده یشه. این کدی که برام نوشتین آیا بجای مقدار min-width: 960px میتونم درصد بدم که همه چیز درست بشه مثلا ۱۰۰٪ بدم ؟فکر کنم کاربر اگه هر قدر اینترنت اکسپلوررو کوچیک کنه قالب سایت من ثابته و دیگه عمودی نمیشه!به نظرتون درسته؟
راستی بالا یک پست به اسم من هست و شما پاکش کردین ولی من یادم نمیاد چنین پستی زده باشم میشه بفرمایید محتوای پست چی بود که نوشتین فاقد محتوای فنی البته قصدم جسارت نیست فقط چون خودم اینجور چیزی نذاشتم گفتم شاید کسی از یوزرم داره استفاده میکنه
Saber Mogaddas
چهارشنبه 04 مرداد 1391, 09:31 صبح
سلام
بله min-width داده درصدی رو نیز ساپورت می کنه ولی این کار درست نیست، شما درکتون از % درست نیست. وقتی با درصد اندازه رو تعیین می کنید الان اگه مرورگر max تمام صفحه رو مثلا 100px در نظر بگیرید مثلا اگه کاربر مرورگر رو به اندازه عرض 60 px کوچک کرد این 100درصد تو 60 پیکسل تعیین خواهد شد و هر چه کوچک کنید به همون اندازه نیز min-height مقدارش میاد پایین ..ولی یه چیز ثابت شده هست که عرض 980 نرمال و عرض 1007 نیز حداکثر برای هر اندازه مانیتور جواب خواهد داد..و بهترین روش استفاده کردن از داده پیکسلی هست..
موفق باشید..

-- پا ورقی تاپیک شما :


اینجوری میشه که سوالامو میرم تو تادیک هایی مثل php میپرسم حتی اگه ربطی به php نداشته باشه اخه اونجا ۴ نفر پیدا میشه سوال آدمو جواب بدن ولی اینجا . . .
armintirand
جمعه 13 مرداد 1391, 17:57 عصر
سلام
من این دستور شما رو توی استایل سایتم قرا دادم ولی هنوز همون آشو همون کاسه است.
از این دستور استفاده کردم
#a{min-width:980px;width:1500px}
armintirand
شنبه 14 مرداد 1391, 09:50 صبح
میدونم ماه رمضونه و دوستان حوصله کمتری دارن ولی فکرنکنم برای دوستان سوال سختی باشه آخه بعضی وقتها یک قالبهایی طراحی می کنن که آدم یک دل نه صد دل عاشقش میشه حالا اگه ممکنه یک نگاهی هم به مشکل من بندازین البته لطفا چیزی که میگین رو اول تست کنید چون هر دفعه یکی از دوستان محبت میکنن و یک کمک میکنن ولی بعد اینکه فرمایش ایشون رو انجام میدم جواب نمیگیرم و باید دوباره بیفتم دنبال یکی که کمک کنه.
ممنون
mlf_mlv
یک شنبه 15 مرداد 1391, 04:58 صبح
بعضی جا ها اندازه ها رو به % دادید بعضی جا ها به پیکسل. وقتی صفحه مرورگر رو کوچیک می کنید اونهایی که به % دادید کوچیک می شن ولی اونهای که به پیکسل دادید ثابت می مونن، برای همین صفحه به هم می ریزه..
من خودم همیشه از پیکسل برای اندازه دهی استفاده می کنم، پهنای صفحه کمتر کسی کمتر از 1024 پیکسله.. طراحی سایت برای کسایی که رزولوشنشون کمتر از این مقداره مثه تلاش برای نوشتن برنامه ایه که روی ویندوز 95 هم کار کنه..
اگر هم کسی سایز براوزرش رو کوچیک می کنه انتظار نداره سایت کوچیک بشه، انتظار داره یه اسکرول افقی اضافه بشه که هرجای سایت خواست رو باش بتونه ببینه