সিএসএস প্রদর্শন: সারণী ন্যূনতম-উচ্চতা কাজ করছে না


104

কেউ কি জানেন যে আমি সর্বশেষতম ব্রাউজারগুলির সাথে ন্যূনতম-উচ্চতার কাজ করতে পারি? আমি সিএসএস টেবিল ব্যবহার করছি এবং এটি ন্যূনতম উচ্চতা উপেক্ষা করবে বলে মনে হচ্ছে।

<div style="background-color: red; display: table; min-height: 100px;">
abc
</div>

বেহালা



1
আপনি কি CSS টেবিলগুলি সংজ্ঞায়িত করতে পারেন ? কিছু মার্কআপ পেয়েছেন?
অ্যালেক্স

1
আপনার এইচটিএমএল পোস্ট করুন, সিএসএস অনুযায়ী এবং যদি সম্ভব হয় তবে আপনার সমস্যাটি দেখানোর জন্য আপনার সাইটে একটি লিঙ্ক দিন (বা jsfiddle.net তৈরির চেষ্টা করুন )।
oezi

এটি ফায়ারফক্সের সাথে এখনও একটি সমস্যা, যদিও চৌদ্দ বছর ধরে এই বাগটি রিপোর্ট করা হয়েছে। bugzilla.mozilla.org/show_bug.cgi?id=307866
ফ্রেডেরিক

উত্তর:


204

টেবিলগুলি ব্যবহার করার সময়, উচ্চতা মূলত ন্যূনতম উচ্চতা হয়, কারণ টেবিলগুলি সর্বদা প্রসারিত থাকে। কেবল "মিনিট" থেকে মুক্তি পান এবং এটি আপনার প্রত্যাশা অনুযায়ী কাজ করবে।


13
এটি সম্পূর্ণ অপ্রয়োজনীয়, তবে স্পট-অন। সেরা ফলাফলগুলি অন্তঃস্থ display: table-cellউপাদানগুলিতে "স্থির" উচ্চতা স্থাপনের সাথে উপস্থিত বলে মনে হয় ।
ইটারনিকোড

4
আমি IE তে পরীক্ষা করিনি তবে মনে হয় ফায়ারফক্স কেবলমাত্র এটির দ্বারা আক্রান্ত হয়েছে।
ডেক্স

2
নিশ্চিত হয়ে গেছে যে ম্যাকের ক্রোম 37, সাফারি 7 এবং এফএফ 32 এ heightকাজ করে এবং min-heightনা করে। উইন 8.1-এ আইই 11 উভয়ের মধ্যে সঠিক আচরণ দেয়। jsfiddle.net/nuwcyvwn/1
স্টিফান মুলার

1
সত্য না. যদি আমি চাই যে একটি টেবিলটি সর্বনিম্ন 8 ইঞ্চি লম্বা হয়ে উঠুক (আমি মুদ্রণ নিয়ন্ত্রণের জন্য সিএসএস ব্যবহার করি) এবং এটি পূরণ করার জন্য যথেষ্ট সারি নেই, তবে আমার একটি টিফুট সংজ্ঞায়িত করা হয়েছে, আমি একটি স্পেসার সারি সরবরাহ করতে পারি (উল্লম্বভাবে প্রসারিত করার অনুমতি দেওয়া হয়েছে), সংজ্ঞায়িত করার সময় আমার অন্যান্য সারিগুলিতে উচ্চতা যাতে না হয় তা নিশ্চিত করে এবং আমি যা পাই তা একটি বড় ফাঁক যা আমার পাদলেখকে যেখানে রাখা উচিত তা রাখে। ক্রোমে দুর্দান্ত কাজ করে তবে এফএফ বা আমি যে পিডিএফ রূপান্তরকারী ব্যবহার করছি তা নয়; wkhtmltopdf। হ্যাঁ, উচ্চতা কাজ করে, তবে ন্যূনতম-উচ্চতার মতো শব্দার্থকভাবে একই জিনিসটিকে বোঝায় না।
রেইনবাবা

7

height: 1px;টেবিল বা কোনও মান ব্যবহার করুন। মূলত এটির সাথে কাজ করার জন্য আপনাকে টেবিলকে কিছু উচ্চতা দেওয়া দরকার min-height। শুধুমাত্র min-heightফায়ার ফক্সে টেবিলগুলিতে কাজ করবে না।


4
ওপি সর্বশেষতম ব্রাউজারের সাহায্যে এটি কীভাবে কাজ করবে তা জিজ্ঞাসা করছে। আমি তাকে সলিউশন দিয়েছি মাত্র। এটি কীভাবে সঠিক নয়?
vrajs0ni

উচ্চতার মতো কিছু উচ্চতা দিন: আপনি যেমন বলেছিলেন তেমন 1px, তারপর এটি কাজ শুরু করে
মোহাম্মদ হুসেন

1

যখনই আপনি ব্যবহার করছেন display:table;বা কোনও গভীর সম্পত্তি যেমন display:table-cell;ব্যবহারের heightপরিবর্তে বিবেচনা করুন min-height। টেবিলগুলির মতো উচ্চতা = মিনিট উচ্চতায় সেগুলিতে স্বয়ংক্রিয়-স্প্যান বৈশিষ্ট্য বিবেচনা করে।


1

ফায়ারফক্সের জন্য সমাধান

যোগ উচ্চতা সেটিং আনলক করতে সর্বনিম্ন উচ্চতা

div {
    display: table;
    width: 100%;
    height: 0;
    min-height: 100px;
}

প্রত্যাশার মতো কাজ করার জন্য উচ্চতার সংখ্যাটি অন্য কোনও আসল মান কম বা ন্যূন-উচ্চতার সমান হতে পারে।

আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.