مشکل در تراز متن لیست

این تاپیک 12 پاسخ و 2 مشارکت کننده دارد . آخرین آپدیت توسط :  فرشید رضایی ،‏ 2 سال و 7 ماه پیش .

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

نویسنده پست
سه شنبه ، 22 آوریل 2014     7:53 ب.ظ #


بهرام

Subscriber
263 پست84 تاپیک

سلام به همگی

خسته نباشید

من یک مشکلی پیدا کردم توی وسط قرار گرفتن li های یک ul. اگه به عکس هایی که قرار دادم نگاه کنید فکر میکنم احتیاجی به توضیح نیست دیگه. کدی که زدم رو هم در انتها قرار میدم. الان مشکل من تو تراز کردن متن اون li ها هست که همون کلمات "پارس" "93" و "35/000/000" هستش.

میشه به اینا margin یا padding داد که یک فاصله ای از هم دیگه و دیواره ها پیدا کنند تا خوانا تر بشه اما مشکل اینه که باز هم کل مجموعه وسط (center) نیست. میخوام وسط قرار بگیره. کد رو هم پیوست کردم.

پیوست ها:
You must be logged in to view attached files.
0  تشکر
چهار شنبه ، 23 آوریل 2014     2:00 ق.ظ #


فرشید رضایی

Subscriber
14 پست0 تاپیک

سلام

دوست عزیز چون کدها رو به صورت کامل ندارم نمیتونم زیاد کمکت کنم . این موردا تو css خیلی آسونه که میشه به قول خودت با margin درستش کردم.اما یادت باشه دستور padding باعث میشه کل ulت فاصله بگیره از تو عکسه نه متن هات.واسه متن هات میتونی واسه همشون کلاسی به اسم .text-content ایجاد کنی و تو اون هر تغییری که میخوای رو ذکر کنی تا در موارد بعدی نیازی به نوشتن دوباره ی وسط چین کردن نباشه

مثلا اینطوری

 

.text-content {

text-indent:20px;

رنگ متن ها

حالت های موس

و ... رو نیز تعریف کنی

}

 

میتونم برات درستش کنم اما بدون داشتن کدهای کامل(کل فایل هات تا عکس و متنارو نمایش بده چون بدون اینا درهم بر هم نمایش داده میشن)

 

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

text-align

text-indent     این مورد فرو رفتگی متن ها رو تغییر میده.مثلا اول راست چین میکنی متن رو بعد این دستور رو بهش میدی و مقدارش رو هم بر فرض 20 پیکسل میذاری.اینطوری 20 پیکسل از ulت فاصله میگیره.دیگ بسته به نیاز خودت داره

 

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

یا علی

 

1  تشکر
چهار شنبه ، 23 آوریل 2014     2:14 ق.ظ #


فرشید رضایی

Subscriber
14 پست0 تاپیک

دوست عزیز درستش کردم برات

این کد رو تو قسمت css قالبت بزن

#text-content{
float:right;
margin-right:35px;
}

 

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

بعد ک کپی کردی حالا میری تو ulت و آیدی text-content رو بهش اضافه میکنی تموم

 

در مورد text-indet ی چیز رو یاد نبود بگم.این دستور واسه جایی به دردت میخوره که جلمت بدون فاصله باشه.چون اگه نباشه بین هر کلمه به هر مقداری که بهش دادی فاصله میندازه و بدریخت میشه

 

موفق باشی

یا علی

1  تشکر
چهار شنبه ، 23 آوریل 2014     9:08 ق.ظ #


بهرام

Subscriber
263 پست84 تاپیک

مرسی که وقت گذاشتی آقا فرشید شرمندم کردی. با text-indent یا margin میشه اما مشکل که پیش میاد اینه که همونطور که میبینی یک باکس واسه آگهی ماشین هست. دارم یه سایت واسه یه نمایشگاه درست میکنم. مشکل اینجاست که همه ماشینا یه اسم یه قیمت که ندارن و فضای پایین اون باکس آگهی که واسه نمایش این دو مورد هم هست محدوده. به عنوان مثال عرض میکنم اگه من بیام متن رو برای ماشین سمند با قیمت 25/000/000 با text indent یا margin تراز کنم و به عنوان مثال 20px فاصله از کنار بدم و 10px هم فاصله بین خود li ها بعدا که این کلمه سمند به یک اسم طولانی تر مثل فولکس واگن یا بی ام و 350 تغییر یا قیمت از 25/000/000 به 250/000/000 تغییر کنه با اون margin , text-indent که برای سمند در نظر گرفتم دچار بهم ریختگی و شکستگی متن میشه.

حالا من میتونم این فاصله های margin , text-indent رو کم بگیرم طوری که در آخر فضای خالی اونقدر اضافه بیاد که اسم و مدل های طولانی هم جا بشند و مشکلی پیش نیاد اما تو ظاهر وقتی 20 از این باکس ها کنار هم قرار میگیرن اینکه متن ها به سمت راست تمایل دارند جالب نمیشه از نظر ظاهر. واسه همین دنبال اینم که متن مرکز قرار بگیره که همه از نظر ظاهر یک دست باشه و ضمن اینکه بعدا اگه اسامی طولانی تر شد از اون فضای خالی که دو طرف قرار داره استفاده کنه. نمیدونم تونستم منظور رو برسونم یا نه

0  تشکر
چهار شنبه ، 23 آوریل 2014     12:57 ب.ظ #


فرشید رضایی

Subscriber
14 پست0 تاپیک

سلام.خواهش میکنم وضیفم بود

ی عکس انداختم از کاری که خودم کردم اگه خواستی بگو کداشو بهت بدم

دقیقا هون چیزی هستش ک شما میخوای

 

پیوست ها:
You must be logged in to view attached files.
1  تشکر
چهار شنبه ، 23 آوریل 2014     12:58 ب.ظ #


فرشید رضایی

Subscriber
14 پست0 تاپیک

تو عکس بالایی که پیوست کردم حداکثر قیمت واسه یه ماشین دیگه 999 میلیارده که تو این مقدار بهم ریختگی نداره مگه اینکه بخوای تریلیون هم بذاری.    دی:

یا علی

1  تشکر
چهار شنبه ، 23 آوریل 2014     7:23 ب.ظ #


بهرام

Subscriber
263 پست84 تاپیک

اگه ممکنه کدشو بده. ممنون

هر چند امروز یه خراب کاری اساسی کردم. تمام پوشه www رو تو ومپ shift delete کردم بعدم دو سه تا نرم افزار نصب کردم دیگه ریکاور هم نمیشه

0  تشکر
چهار شنبه ، 23 آوریل 2014     7:57 ب.ظ #


فرشید رضایی

Subscriber
14 پست0 تاپیک

دوست عزیز فایل هایی که خودم دارم رو برات ضمیمه کردم نگاشون کن میفهمی چی بهشون اضافه شده

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

به ulها توجه کن

همچنین تو بخش css : به .ul-mainInfo li

و #t-content توجه کن چون تغییرات رو تو اینا اعمال کردم

مشکلی داشتی در خدمتم

یا علی

پیوست ها:
You must be logged in to view attached files.
0  تشکر
چهار شنبه ، 23 آوریل 2014     11:51 ب.ظ #


بهرام

Subscriber
263 پست84 تاپیک

دوست خوبم شما اومدی طول و عرض کلی رو زیاد کردی واسه همین اوکی شده اگه نه عرض رو 222 قرار بدی متن شما هم خراب میشه و ضمن اینکه متن شما هم به سمت راست مایل هست و درواقع راست چینه و اگه اون عدد 999/000/000/000 رو به 99 تغییر بدی میبینی که سمت چپ خالی میمونه

0  تشکر
پنجشنبه ، 24 آوریل 2014     1:50 ق.ظ #


فرشید رضایی

Subscriber
14 پست0 تاپیک

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

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

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