رفتن به مطلب

فریز کردن جدول در html یا css


پست های پیشنهاد شده

سلام

جدولهایی که در بین پستهای سایت درست میکنم وقتی متن داخل هر سلول جدول بزرگ میشه، اندازه سلول هم بزرگ میشه و نظم جدول به هم میریزه

چطور میتونم کاری کنم که سلول ها ثابت بمونه و اگر متن طولانی بود و از اندازه سلول بزرگتر شد، سه تا نقطه بزنه اخر متن و متن رو نصفه ول کنه تا اندازه سلول تغییر نکنه؟ یعنی میخوام تحت هر شرایطی تمام سلولهای جدول همون اندازه ای باشه که اولش وارد میکنم

 

 

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

لینک به ارسال
در 38 دقیقه قبل، soshiant گفته است :

سلام

جدولهایی که در بین پستهای سایت درست میکنم وقتی متن داخل هر سلول جدول بزرگ میشه، اندازه سلول هم بزرگ میشه و نظم جدول به هم میریزه

چطور میتونم کاری کنم که سلول ها ثابت بمونه و اگر متن طولانی بود و از اندازه سلول بزرگتر شد، سه تا نقطه بزنه اخر متن و متن رو نصفه ول کنه تا اندازه سلول تغییر نکنه؟ یعنی میخوام تحت هر شرایطی تمام سلولهای جدول همون اندازه ای باشه که اولش وارد میکنم

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

سلام شما باید مقدار زیر رو برای کلاس متن ها در جدولتون قرار بدید. اگر عرض رو روی 50 درصد یا مقدار دلخواه بذارید بهتره. (کلاس موردنظر باید جایگزین div در این کد بشه)

  
div {
  width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
 

 

ویرایش شده توسط irani91
لینک به ارسال
در 21 ساعت قبل، irani91 گفته است :

سلام شما باید مقدار زیر رو برای کلاس متن ها در جدولتون قرار بدید. اگر عرض رو روی 50 درصد یا مقدار دلخواه بذارید بهتره. (کلاس موردنظر باید جایگزین div در این کد بشه)


  
div {
  width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
 

 

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

این کد رو طبق فرمایش شما گذاشتم تو css:

table-x {
  width: 50%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

و جدولمو در قالب در داخل کلاس زیر گذاشتم:

 <div class="table-x">
کدهای جدول
   </div>

ولی تغییری حاصل نشد

لینک به ارسال
در 3 ساعت قبل، soshiant گفته است :

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

این کد رو طبق فرمایش شما گذاشتم تو css:

و جدولمو در قالب در داخل کلاس زیر گذاشتم:


 <div class="table-x">
کدهای جدول
   </div>

ولی تغییری حاصل نشد

سلام 

table-x {
  width: 50% !important;
  white-space: nowrap;
  overflow: hidden !important;
  text-overflow: ellipsis;
}

جلوی مقادیر overflow و width مثل کدهای بالا !important بزارید تست کنید

لینک به ارسال
در در 6/28/2019 at 18:12، irani91 گفته است :

سلام 


table-x {
  width: 50% !important;
  white-space: nowrap;
  overflow: hidden !important;
  text-overflow: ellipsis;
}

جلوی مقادیر overflow و width مثل کدهای بالا !important بزارید تست کنید

نشد متاسفانه

لینک به ارسال

به گفتگو بپیوندید

هم اکنون می توانید مطلب خود را ارسال نمایید و بعداً ثبت نام کنید. اگر حساب کاربری دارید، برای ارسال با حساب کاربری خود اکنون وارد شوید .

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.

×
×
  • اضافه کردن...