سوال: قرار دادن دیوهای مجاور ،به ترتیب دلخواه در Deviceهای با سایز کوچکتر [بایگانی]

bftarane

شنبه 11 مرداد 1393, 12:50 عصر

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

ممنون
من یه نمونه تستی درست کردم ولی نتونستم سناریوی بالا رو پیاده کنم.

<html>
<head>
<style>
#content {
width: 20%;
float: left;
background:purple;

}

#middle {
width: 64.3%; /* Account for margins + border values */
float: left;
margin-right:2px;
margin-left:2px;
background:yellow;

}

#sidebar {
width: 15%;

float: left;
background:red;
}

/* for 980px or less */
@media screen and (max-width: 980px) {
#content {
width: 20%;
float: left;
background:purple;

}

#middle {
float:none;
clear:both;

}

#sidebar {
width: 15%;

float: left;
background:red;
}
}
</style>
</head>
</head>
<body>
<div id="content">1</div>
<div id="middle">2</div>
<div id="sidebar">3</div>
</body>
</html>

masoud_pnu

شنبه 11 مرداد 1393, 14:17 عصر

ممکنه بیشتر توضیح بدید؟واسه چی این اتفاق باید بیفته؟ منظور زمانیه که صفحه از portrait به landscape تبدیل بشه؟

bftarane

شنبه 11 مرداد 1393, 18:48 عصر

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

راستی اصلاً عرض دیوها مد نظرم نبود فقط اون ترتیب قرارگیری برام مهمه. با none کردن خاصیت float یکی از دیوها دو تا دیو دیگه کنار هم می افتن ولی من می خوام حتماً دیوهای چپ و راست کنار هم بیفتن.

دانیال دزفولی

شنبه 11 مرداد 1393, 18:57 عصر

به دیو 2 تو ریسپانسیو
float none
clear both
width 100%
بده ببین به کارت میاد

2020s1371

شنبه 11 مرداد 1393, 21:19 عصر

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

راستی اصلاً عرض دیوها مد نظرم نبود فقط اون ترتیب قرارگیری برام مهمه. با none کردن خاصیت float یکی از دیوها دو تا دیو دیگه کنار هم می افتن ولی من می خوام حتماً دیوهای چپ و راست کنار هم بیفتن.
نمونه : فکر کنم نمونه این چیزی که تقریبا میخواید توی سایت آپارات پیاده سازی شده
وقتی یه ویدئو رو باز میکنی که صفحه ش بیاد و اونجا ببینیش ، سمت راستش دکمه ی دانلود و .. قرار گرفته و وقتی صفحه مرورگر رو کوچک کنید اون قسمت که دانلود و.. داشت به زیر محل نمایش منتقل میشه
البته فقط از باب شباهت ایده گفتم.همین
موفق باشین

bftarane

یک شنبه 12 مرداد 1393, 09:06 صبح

ممنون.
در لینک زیر دو تا جواب دادن. یکی با position relative و یکی با absolute مشکل رو حل کرده. ولی باید برم دقیق بخونم ببینم رو پروژه خودم پیادش کنم ببینم مشکلی پیش میاد یا نه. آخه من کلاً با position absolute تا جایی که بشه کار نمی کنم. و اون relative هم تا جایی که می دونستم پیش فرض relative هست. حالا نمی دونم چطور relative اینجا مشکل رو حل کرده. باید بیشتر بررسی کنم.
http://stackoverflow.com/questions/25093556/put-floated-divs-in-desired-order-in-smaller-devices/25098154#25098154

masoud_pnu

یک شنبه 12 مرداد 1393, 13:50 عصر

بی ربطه ولی فکرکنم بیخود ترین سایتی که به عمرم دیدم آپاراته.محتواش رو که بیخیال شیم، الباقی همش بیخوده.نه سرعت داره سرورش، پلیرش که فکرکنم یه پلیر از تو stackoverflow کپی کردن! هیچ امکاناتی نداره.سیستم جستجوی الکی ترین سایت ها از likeتو کوءری های sqlاشون استفاده میکنن، اما این اینطور نیست.باید دقیقا و عینا عبارت جستجو با محتوا یکی باشه.پیشنهاد هنگام سرچ نداره،جبران افت سرعت رو با افت کیفیت ویدیوها جبران کردن!!درحالی که توی همین نت یه پروژه اپن سورس واسه افزایش سرعت لود هست.واقعا موندم.

2020s1371

یک شنبه 12 مرداد 1393, 15:27 عصر

بی ربطه ولی فکرکنم بیخود ترین سایتی که به عمرم دیدم آپاراته.محتواش رو که بیخیال شیم، الباقی همش بیخوده.نه سرعت داره سرورش، پلیرش که فکرکنم یه پلیر از تو stackoverflow کپی کردن! هیچ امکاناتی نداره.سیستم جستجوی الکی ترین سایت ها از likeتو کوءری های sqlاشون استفاده میکنن، اما این اینطور نیست.باید دقیقا و عینا عبارت جستجو با محتوا یکی باشه.پیشنهاد هنگام سرچ نداره،جبران افت سرعت رو با افت کیفیت ویدیوها جبران کردن!!درحالی که توی همین نت یه پروژه اپن سورس واسه افزایش سرعت لود هست.واقعا موندم.

منم فقط همون قسمتی رو ک گفتم مدنظرم بود و نه بقیه ی جوانب سایت

ولی خب چکار میشه کرد ... ما ک جز آپارات و تخته سفید و چندتا سایت دیگه چیزی نداریم؟؟ چکار کنیم؟؟

شما هم فک کنم بتونین این اقداماتی که اسم بردین رو کمکشون کنین درست کنن.... حتی با چند ساعت وقت بیکاریتون فکر کنم بتونین کمک کنین..
نظر شخصی : اگه رایگان هم کمکشون کنین به امثال ماهایی که از این سایت ها استفاده میکنیم کمک بزرگی کردین..

masoud_pnu

یک شنبه 12 مرداد 1393, 19:25 عصر

نظر لطف شماست.والا چی بگم؟مشکل بزرگ ما ایرانیا خودبزرگ بینی عجیبیه که داریم!چندوقت پیش قرار شد برم واسه یه شرکتی کار کنم.باورتون نمیشه اونی که مصاحبه ازم میگرفت وقتی رزوممو دید انگار جرم کرده بودم!! به جای اینکه مصاحبه بکنه داشت میگفت اینجای کارت ایراد داره و...!!من ووقعا از انتقاد سازنده خوشم میاد.ازشعارم بیزارم.ولی این یکی دیگه نوبر بود!!
الان بگم به شرکت سازنده آپارات این مشکلاتو داری، هیچ بعید نیست هزارتا انگ هم بهم بچسبونن!!
ما مخلص شما عزیزان هستیم.