برگزیده های پرشین تولز

این لایه ها چرا کنار همدیگه قرار نمیگیرن؟

mohammad ali

کاربر تازه وارد
تاریخ عضویت
17 دسامبر 2006
نوشته‌ها
30
لایک‌ها
0
سلام

من یه مشکل پیدا کردم. الان 2 ساعتی میشه که دارم باهاش ور میرم اما درست نمیشه.
اینو بگم که من css بلد نیستم و این کد ها رو با MS Expression Web ساختم.
لطفا کمکم کنید ، حیاتی هست:

من چند تا لایه ( div ) ساختم ، اینطوری:
کد:
<div id="main">

<div id="left"></div>
<div id="right"></div>

</div>
این استایل رو هم بهشون دادم:
کد:
#main {
	width: 800px;
	border: 0;
	margin: 0 auto;
	padding: 0;
}

#left {
	background-image: url("../images/left.png");
	background-repeat: no-repeat;
	left: 0px;
	width: 200px;
	height: 50px;
	position: absolute;
}

#right {
	background-image: url("../images/right.png");
	background-repeat: no-repeat;
	width: 200px;
	height: 50px;
	left: 800px;
	position: absolute;
}

لایه ی main هم دقیقا وسط صفحه هست.
حالا مشکل من اینه که وقتی مقدار left رو برای لایه های چپ و راست ست میکنم ، این مقدار از کنار صفحه شروع میشه نه از کنار لایه ی main.
حالا مثلا من بیام و همه دیو ها رو تنظیم کنم ، کاربر وقتی بخواد صفحه رو minimize کنه یا رزولوشنش فرق داشته باشه تمام صفحه بهم میریزه.

حالا سوال من اینه:

چطور میتونم لایه ی right رو درست داخل لایه ی main و سمت راست و لایه ی left رو داخل لایه ی main و سمت چپ بزارم؟

راستی ، یه لایه دیگه هم دارم که باید کنار left بچسبه ، اونو چطوری انجام بدم؟


این سوال حیاتی هست ، لطفا زودتر پاسخ بدید.

پیشاپیش متشکرم.
 

شايان

مدیران قدیمی
تاریخ عضویت
2 سپتامبر 2003
نوشته‌ها
4,813
لایک‌ها
9
۲ تا مقدار position دارید تو css هاتون که جفتش <absolute> هست. هر دو رو بکنید <relative> . درست میشه.
 

mohammad ali

کاربر تازه وارد
تاریخ عضویت
17 دسامبر 2006
نوشته‌ها
30
لایک‌ها
0
ببخشید آقا شایان
مطمئنی باید از relative استفاده کنم؟
اینهایی که دارم میسازم برای دکمه های ناوبری هدر سایت هست.
برای هر کدوم از این دکمه ها که اینو ست میکنم و دکمه بعدی به اندازه 50 پیکسل هر دکمه میره پایینتر، یعنی به اندازه ارتفاع هر کدوم از دکمه ها. بعدش مجبورم top و left رو برای هرکدوم از دکمه ها تغییر بدم که این کار رو میکنم.

خب ، اینجا درست شد ، اما لایه messages ( قسمت زیر هدر که متن صفحه توش هست ) به اندازه ارتفاع کل دکمه های هدر رفته پایین و با top هم نمیتونم درستش کنم:
کد:
#messages {
	width: 800px;
	margin: 0 auto;
	padding: 0;
	border: 0;
	top: -300px;
}

الان لایه مسیجز 300 پیکسل با هدر فاصله داره و همونطور که گفتم نتونستم اونو به هدر بچسبونم.
 

amir abbas

Registered User
تاریخ عضویت
28 سپتامبر 2004
نوشته‌ها
388
لایک‌ها
17
شما به اون بلوک main
کد:
position: relative;
رو اضافه کن
اندازه بلوک هر دو سمت رو هم برای بلوک وسطی margin در نظر بگیر که متن وسط صفحه نره زیر اون دو تا ستون کناری
اون دو تا بلوک سمت چپ و راست رو هم میتونی بزاری همونطوری absolute باقی بمونن.
البته میتونی اون دو تا بلوک سمت چپ و راست رو هم به شکل شناور در بیاری و از خصوصیت float استفاده کنی.
 

mohammad ali

کاربر تازه وارد
تاریخ عضویت
17 دسامبر 2006
نوشته‌ها
30
لایک‌ها
0
بیشتر از 6 ساعت امروز پاش وقت گذاشتم ، اما نمیشه که نمیشه.
آخه من html و css رو خیلی خوب بلد نیستم.

میشه یه نفر لطف کنه و یه لایه به پهنای 800 پیکسل بسازه و 4 تا لایه دیگه توش بزاره ، بطوری که همگی کنار هم باشن و به هم چسبیده باشن؟
بک گراند و سازش رو خودم میتونم تنظیم کنم.
ممنون میشم اگه کسی این کارو بکنه.
 

mohammad ali

کاربر تازه وارد
تاریخ عضویت
17 دسامبر 2006
نوشته‌ها
30
لایک‌ها
0
اینجا کسی نیست به من کمک کنه؟
256.gif

من هیچی وقت ندارم
258.gif
کمک
254.gif
 

amir abbas

Registered User
تاریخ عضویت
28 سپتامبر 2004
نوشته‌ها
388
لایک‌ها
17
شما تو طراحی بالا که فقط 3 تا بخش در نظر گرفتی
4 تا یه خورده سخت میشه ولی 3 تا رو حالت میتونی درست کنی

تو این صفحه کلی مثال برای قالب 3 ستونی هست
هر کدوم که خوشت اومد میتونی از همون استفاده کنی

http://css-discuss.incutio.com/?page=ThreeColumnLayouts
 

شايان

مدیران قدیمی
تاریخ عضویت
2 سپتامبر 2003
نوشته‌ها
4,813
لایک‌ها
9
آقا یه کاری کن شما ! شما تو photoshop ی ، paint ی چیزی ... اون چیزی که میخوای آخرش در بیاد رو بکش ، بذار اینجا ، من یا هر کس دیگه‌ای که وقت داشته باشه برات html در میاره.
 

alizali

Registered User
تاریخ عضویت
16 ژوئن 2003
نوشته‌ها
659
لایک‌ها
20
800 +200+200=1200
از عرض صفحه خیلی زیادتر میشود
دلیلش این می تواند باشد
 

mohammad ali

کاربر تازه وارد
تاریخ عضویت
17 دسامبر 2006
نوشته‌ها
30
لایک‌ها
0
شما تو طراحی بالا که فقط 3 تا بخش در نظر گرفتی
4 تا یه خورده سخت میشه ولی 3 تا رو حالت میتونی درست کنی

تو این صفحه کلی مثال برای قالب 3 ستونی هست
هر کدوم که خوشت اومد میتونی از همون استفاده کنی

http://css-discuss.incutio.com/?page=ThreeColumnLayouts
ممنونم ، یه نگاهی بهش می اندازم ، نتیجه رو میگم.
آقا یه کاری کن شما ! شما تو photoshop ی ، paint ی چیزی ... اون چیزی که میخوای آخرش در بیاد رو بکش ، بذار اینجا ، من یا هر کس دیگه‌ای که وقت داشته باشه برات html در میاره.
6cgtcw7.jpg

اون موارد خاکستری رنگ هم اندازه هستن.
این طرح تعداد دکمه های بیشتری داره ، برای این ساختم که بعدا دیگه مشکلی نداشته باشم و فقط اندازه دیو ها رو تغییر بدم.
800 +200+200=1200
از عرض صفحه خیلی زیادتر میشود
دلیلش این می تواند باشد
من گفتم اونها توی دیو اصلی هستن ، نه بیرونش.
 

mohammad ali

کاربر تازه وارد
تاریخ عضویت
17 دسامبر 2006
نوشته‌ها
30
لایک‌ها
0
مشکل حل شد!
با تیبل ساختم ، به دیو نمیرسه ، اما بهتر از هیچی هست...
 

ODE112

کاربر قدیمی پرشین تولز
تاریخ عضویت
24 مارس 2006
نوشته‌ها
1,396
لایک‌ها
1,288
محل سکونت
aquarium
مشکل حل شد!
با تیبل ساختم ، به دیو نمیرسه ، اما بهتر از هیچی هست...
شما باید div هاتو همه رو float:left یا float:right میکردی بد از اینکه اونا رو relative کردی!

فقط تو این حالت همشون interline میشن!

امیرم همینو گفت نگرفتی ولی!
 
بالا