উত্তর:
height: 100% উপাদানটিকে তার মূল পাত্রে 100% উচ্চতা দেয়।
height: auto মানে উপাদান উচ্চতা তার বাচ্চাদের উচ্চতার উপর নির্ভর করবে।
এই উদাহরণগুলি বিবেচনা করুন:
উচ্চতা: 100%
<div style="height: 50px">
<div id="innerDiv" style="height: 100%">
</div>
</div>
#innerDiv আছে যাচ্ছে height: 50px
উচ্চতা: অটো
<div style="height: 50px">
<div id="innerDiv" style="height: auto">
<div id="evenInner" style="height: 10px">
</div>
</div>
</div>
#innerDiv আছে যাচ্ছে height: 10px
setting the height of the child element or the container element। আপনার নকশা অর্জনের জন্য আপনার যা যা করা দরকার তা আপনি করতে পারেন, তবে আপনি যেমন নির্দিষ্ট ধারাবাহিকতা অনুসরণ করেন, সদৃশতা এড়ানো, পুনরায় কাজ হ্রাস করে, সাধারণ বিন্যাসগুলি গোষ্ঠীভূত করেন। সংক্ষেপে, আপনার কাজের একটি সিস্টেম / প্যাটার্ন থাকতে হবে, যাতে এটি সহজেই পড়তে এবং পরিবর্তন করা যায় এবং অবশ্যই এটি কাজ করে যায়
autoযাতে উপাদানটি তার সামগ্রীতে এবং তার সন্তানের সামগ্রীতে উভয়ই সমন্বিত করে তোলে। বিপরীতে একটি স্থির উচ্চতার মান এমন সামগ্রীতে বৃদ্ধি পায় না (বা দেখায়) যা ঘোষিত উচ্চতার মধ্যে ফিট করে না। jsfiddle.net/m3f8y6xr/1 এই উত্তরটি, আমি বিশ্বাস করি, এটি পর্যাপ্ত পরিমাণে ডিম্বনীয় করে তুলতে বলা যায় না যে উপাদানটি সমস্ত সামগ্রী অন্তর্ভুক্ত করতে বৃদ্ধি পাবে, এটি তার নিজস্ব পাঠ্য বা কোনও সন্তানের বিষয়বস্তু হোক। অবশ্যই এটি যুক্তিযুক্ত হতে পারে যে এটির নিজস্ব পাঠ্যও একটি শিশু। এটি আচরণের ভিজ্যুয়াল কনফার্মেশন সরবরাহ করে।
একটি 100% উচ্চতা জন্য, হয় সম্ভবতঃ, আপনার উচ্চতা ব্রাউজারের ভিতরের উইন্ডোর , কারণ যে তার পিতা বা মাতা উচ্চতা , পৃষ্ঠা। একটি autoউচ্চতা ধারণের জন্য প্রয়োজনীয় সর্বনিম্ন উচ্চতা হবে ।
ডিফল্টটি height: autoব্রাউজারে থাকে তবে height: X%ধারণকৃত ব্লকের শতাংশে উচ্চতা নির্ধারণ করে।
উচ্চতা: 100% কাজ করে যদি পিতামাতার ধারকটির একটি নির্দিষ্ট উচ্চতার সম্পত্তি থাকে অন্যটি কাজ করে না
10px + the size it needs for its own content- এই jsfiddle দেখুন