مشکل در بلوک های div قالب طراحی شده(مشکل float)

این تاپیک 33 پاسخ و 6 مشارکت کننده دارد . آخرین آپدیت توسط :  مهدی جی اج ،‏ 4 ماه پیش .

این تاپیک تاکنون 753 بازدید داشته است .

نویسنده پست
جمعه ، 5 آگوست 2016     2:02 ق.ظ #


مهدی جی اج

Subscriber
18 پست2 تاپیک

سلام دوستان

خسته نباشید

 

اول از همه بگم کخ من خیلی مبتدی هستم و تازه html و css رو تموم کردم

 

بعنوان اولین طراحیم با div چنتا بلوک طراحی کردم و با float اونها رو کنار هم چیدم

مشکل اینجاس که وقتی ارتفاع post_content من از یه مقداری بیشتر میشه کلا بهم میریزه بلوک هام

 

با مقایسه دو عکس زیر فکر میکنم دقیقا منظورمو برسونم

 

 

ممنون میشم راهنمایی کنید

مرسی

پیوست ها:
You must be logged in to view attached files.
0  تشکر
جمعه ، 5 آگوست 2016     7:43 ق.ظ #


مهران

Subscriber
166 پست2 تاپیک

سلام دوست عزیز مهدی جی اج

باید کد ها رو دید تا گفت دقیقا مشکل چیه احتمالا به کاربرد درست clear:both مربوط میشه ولی تا کد ها دیده نشه نمیشه همین طوری گفت مشکل مربوط به فلان مورد چون من اصلا خبر ندارم شما چطوری کد زدی توی قالبت باتوجه به سایر کد های قالبت میشه نظر داد

9  تشکر
جمعه ، 5 آگوست 2016     11:42 ق.ظ #


مهدی جی اج

Subscriber
18 پست2 تاپیک

@Mehran

 

آخ اخ شرمنده یادم رفته بود لینکو بدم

 

 

اینم لینک :

http://s1.picofile.com/file/8262161450/psd2hml_tamrini.rar.html

 

اما من هر کاری کردم متاسفانه درست نشد:(

0  تشکر
جمعه ، 5 آگوست 2016     12:32 ب.ظ #


محمد ملکی

Subscriber
76 پست6 تاپیک

طراحی است به طور کلی این ایراد ها رو داره :

1- ابتدا باید یک قالب کلی طراحی شه ( جدول صفحه بندی بشه )

2 -float ها باید در کنار هم باشند یعنی سمت راستی ها با هم و سمت چپی ها باهم ( فاصله به خاطر همینه فکر کنم )

3- برای ساخت ساید بار های کناری بهتره از یک نوه کد استفاده بشه یعنی برای قسمت چت و تبلیغ نیاز به ایجاد ساید از دوباره نیست.

در کل بهتره گرافیکش رو  بهتر کنید

باتشکر

 

1  تشکر
جمعه ، 5 آگوست 2016     12:54 ب.ظ #


مهدی جی اج

Subscriber
18 پست2 تاپیک

محمد ملکی ممنون از پاسختون

 

1.مگه اینی که الان هست قالب کلی نیس؟

همه تگ ها داخل تگ main هست و ....

2.یعنی سمت چپی ها رو با هم و سمت چپی ها رو با هم بگذارم حل میشه؟ و اینکه پس وسطی ها رو چیکار کنم ؟

3.یعنی این دو قسمت رو کلا بزارم تو یه div ?

 

ببخشید میدونم خیلی مبتدیه طرح اولمه دیگه

0  تشکر
جمعه ، 5 آگوست 2016     1:58 ب.ظ #


hojat

Subscriber
95 پست3 تاپیک

دوست عزیز من بصورت کلی نگاه کردم دیدم چیدمان بلاک های اصلی شما اشتباه هست.

برای چیدمان صحیح و قرار گیری درست المان ها باید اینگونه عمل کنید.

ابتدا یک کلاس برای کل سایت.

برای محتوا می بایست ابتدا برای سایدبار سمت راست یک بلاک جداگانه قرار داد سپس در آن بلاک قسمت های دیگر راقرار داد و برای قسمت های دیگر هم همینگونه.

به فرض مثال:شما ابتدا سه بلاک ایجاد کنید.اول برای قسمت راست بعد وسط و سوم سمت چپ یعنی قالب سه ستونه.

به این سه بلوک می توان هر سه float:right; داد تا در کنار هم قرار گیرند.حال باید شما تمام المان یا بلاک های محتوای خود را در این سه بلاک قرار داد یعنی مثلا برای سمت راست قسمت تبلیغات و اتاق گپ  می  خواهید که برای ایجاد این بلاک های باید در بلاک اصلی سمت راست قرار داد و برای قسمت های دیگر هم همینگونه عمل کنید.

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

موفق باشید

1  تشکر
جمعه ، 5 آگوست 2016     2:37 ب.ظ #


مهران

Subscriber
166 پست2 تاپیک

دوست عزیز مهدی جی اج

من به قالبتون نگاه کردم همون طور که دیگر دوستان گفتند به طور کلی بلوک بندی سایت کاملا اشتباهه،علتش اینکه تجربتون کمه و همه ی ما هم همین اشتباه ها رو اوایل می کردیم!

من یک بار از نو قالبتون رو کد زدم البته رنگ بندی ها و غیر رو به سلیقه ی خودم انجام دادم ولی اونی که مهمه نحوه ی کد نوشتنه که مطمئنم اگر به کد ها نگاه کنید تجارب بسیار خوبی کسب می کنید

مثل نگاه کنید که سه تا اول div زدم بعد درون هر div یه تعداد دیگه div زدم یا div های مربوط به چپ و راست و مطلب رو داخل یه div گذاشتم و به همه float:right دادم و...

البته هزینه داره اینکه بخوام این قالب رو بهت بدم اونم اینکه واسه سلامتی و موفقیت در کار هام 10 تا صلوات بفرستی! نفرستی حلالت نمی کنم:)

در مورد هر بخش هم که متوجه نشدی همین جا بپرسی توضیح میدم

البته بگم قالب سئو نیست چون شک داشتم که تگ های سئو رو بدونید یا نه

لینک دانلود

6  تشکر
جمعه ، 5 آگوست 2016     2:53 ب.ظ #


مهران

Subscriber
166 پست2 تاپیک

اول اینکه به این قالب با 1024px ببینید(الان یادم اومد max-width ندادم)

دوم اینکه توضیحش به این صورته که قراره سه تا ستون بزنیم پس سه تا div دارم که به هر کدوم یه کلاسی میدیم

right-side
post-box
left-side

الان به هر سه ی اینا این استایل رو میدیم
float:right
یه قضیه هم که هست اینکه من به درصد بهشون عرض دادم و طوری تنظیم کردم که با margin در کل بشه 100%
البته بگم که در استایل به کل محتوای صفحه این استایل رو دادم
box-sizing:border-box
بقیه اش هم مربوط میشه استایل دهی و زیباسازی
البته برات فونت یکان رو هم گذاشتم که می تونی در طراحی هات ازش استفاده کنی

7  تشکر
جمعه ، 5 آگوست 2016     2:55 ب.ظ #


مهدی جی اج

Subscriber
18 پست2 تاپیک

hojat

ممنون حجت جان

مجددا باید اینجوری که شما گفتید کد بزنم که دستم راه بیفته

ممنونم

 

Mehran عزیز خیلی خیلی ممنونم ازینکه وقت گذاشتی

دقیقا همینطوره

تجربه مهمترین چیزه

حتما به قالبی که زحمتشو کشیدید نگاه میکنم و شیوه صحیح کدنویسی رو یاد میگیرم

ضمن اینکه هزینشم پیش از استفاده پرداخت شد:)

انشالله که همیشه موفق باشی

 

بعد مهران جان  من html و css رو تقریبا یاد گرفتم

 

به نظرت آمادم برم دوره جی کوئری ؟ یا هنوز رو همین html و css کار  کنم؟

 

 

ممنونم

 

0  تشکر
جمعه ، 5 آگوست 2016     2:59 ب.ظ #


مهدی جی اج

Subscriber
18 پست2 تاپیک

Mehran جان

 

آره اتفاقا یکی از همین نکات مهم بحث box-sizing:border-box بود که اینو جدیدا یاد گرفتم و در این کدی که زده بودم هنوز به همون شیوه قبلی(کم کردن مقدار padding و .... از عرض و ارتفاع) استفاده کردم که انشالاه ازین به بعد ازش استفاده میکنم

0  تشکر
پست 1 تا 10 (از مجموع 34 پست)

برای پاسخ دادن به این تاپیک باید وارد سایت شوید .