در نظر گرفتن width در طراحی قالب

[mohammad kafiyan]

با سلام به دوستان
در حال طراحی قالب سه ستونه هستم که div-main اصلی تعرdیف کرده ام با width=960 و سه ستون را درون آن ایجاد کرده ام که دو تا width=180سمت چپ و راست را قرار دادم و در این ستون ها عناصر را قرار دادم ، حال در لپ تاپ با resolution=1366*768 قالب از کناره ها خیلی خالی است ولی در مانیتور ها با resolution پاینتر همه چیز خوبه حال من اومدم کلا این width را حذف کردم و به صورت داینامیک با توجه به عناصر داخل ستونها اندازه قالب و در نهایت اندازه ستونها مشخص می شود و مشکل این فضای خالی هم از بین می رود که در کنارها بود.
حال آیا این کار درستی یا خیر ، یا باید بیایم responsive تعریف کنم.
دوستان می توانید راهنمایی کنید

[پیام حیاتی]

سلام
Width رو باید مشخص کنید 960 اندازه خوبیه که تقریبا در همه دستگاه ها برای نمایش مشکلی پیش نمیاد.
پیشنهاد می کنم از همین الآن Responsive طراحی کنید قالب رو.

[mohammad kafiyan]

خوب به نظر شما و دوستان برای مقدار width باید به صورت % بدهم یا px
اگر div_main اصلی که تمام عناصر داخل آن هست 95% و ستون های داخلی را برحسب درصد بدهم مشکلی در رزولوشن ها ایجاد نمی شود

[سعید کشاورز]

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

[mohammad kafiyan]

با سلام به دوستان عزیز
مطالعاتی در زمینه واکنشگرا بودن سایت انجام دادم و نمونه مثال های ابتدایی در این زمینه هم دیدم
ولی یک مشکل اساسی دارم و اون این هست که اگر سایت دارای header,footer,content باشه که دارای تصاویری است با width ثابت حال چگونه باید برای تصاویر عمل واکنشگرا را پیاده سازی کنم

[پیام حیاتی]

http://demosthenes.info/blog/586/CSS-Fluid-Image-Techniques-for-Responsive-Site-Design
،
http://alistapart.com/article/responsive-images-in-practice
میتونی از کلاس img-responsive در Bootstarp هم استفاده کنی.
سایت p30download آموزش خیلی خوبی رو از شرکت Lynda در مورد respnsive کردن برای دانلود قرار داده که مباحث Responsive Media هم از سرفصل هاشه.

[mohammad kafiyan]

با سلام به دوستان می خواستم بدونم برای طراحی ریسپانسیو برای قالب سه ستونه که div_main و سه ستون داخل آن قرار دارند بهتر است برای width ها برای div اصلی و سه div دیگه از درصد استفاده کنم از پیکسل
بررسی های کردم یکسری با درصد به کار بردن و یکسری پیکسل
یکسری div اصلی درصد دادند و داخلی ها را با پیکسل تعیین کردند
یکسری div اصلی را با پیکسل مشخص کرده اند و ستون های داخلی را با درصد
لطفا راهنمایی بفرمایید
با تشکر

[پیام حیاتی]

سعی کنید همه مقادیر با درصد کار کنید اما در ایجاد فاصله های کوتاه درصد نسبت به پیکسل کارآیی نداره.

[mohammad kafiyan]

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

[SA_Developer]

سلام
فقط با یه درصد دادن شما قالب رو رسپانسیو نکردید. رسپانسیو باید تو تمامی دستگاه ها بدرستی نمایش داده بشه برای مثال الان time.ir خودمون رسپانسیوه.


بهتر width مربوط به div ها را با درصد کار کنم یا پیکسل علت؟؟؟؟
بستگی به خودتون داره. اگر میخواید عرض صفحه نسبت به سایز پنجره مرورگر تعیین بشه درصد بدید فقط یادتون نره max-width بذارید.


و دیگر اینکه چرا پلاگین مربوط به فایرفاکس جهت تست در روزلوشن با تست روزلوشن سیستم لپ تاپ فرق داره دوستان اطلاع دارند
یعنی مثلا رزولوشن 300*250 تو سیستمتون با لپ تاپ فرق داره؟ از یه screen ruler جهت اطمینان کمک بگیرید. در ضمن با ابزارهای انلاین هم میتونید برای تست صفحه استفاده کنید.

[mohammad kafiyan]

سوال اولم

لطفا سایزهای مانیتورهای wide,laptop,tablet,mobile بهترین سایزها برای رزولوشن چیست
تسترهای های آنلاین را هم اگر ممکنه معرفی کنید

سوال دوم هم


@media only screen and (min-width: 768px) and (max-width: 1024px) {

div.Container {
width: 900px;
}
div#Main>.Container>div#LeftCol {
width:26%;
float:left;
/*border:1px solid;*/
margin:5px 0 5px 10px;

}
div#Main>.Container>div#ContentCol {

width:70%;
float:left;
margin:5px 10px;
border:1px solid;
height:500px;
}
div#Main>.Container>div#RightCol{
display:none;
}

}

از کد بالا برای سایز 1024*768 و کمتر استفاده کردم ولی هیچ عکس العملی انجام نمی دهدچرا؟؟؟؟

[mohammad kafiyan]

سلام
دوستان در این زمینه می توانند راهنمایی کنند؟؟؟؟