কম্পিউটার

কিভাবে সিএসএস দিয়ে সমান উচ্চতার কলাম তৈরি করবেন?


CSS এর সাথে সমান উচ্চতার কলাম তৈরি করতে, কোডটি নিম্নরূপ -

উদাহরণ

<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1" />
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
   .container {
      display: table;
      width: 100%;
   }
   .column {
      display: table-cell;
      padding: 16px;
      background-color: greenyellow;
   }
   .column:nth-of-type(2n-1) {
      color: red;
      background-color: yellow;
   }
</style>
</head>
<body>
<h1>Equal Height Columns Example</h1>
<div class="container">
<div class="column">
<h2>Column 1</h2>
<h2>Column 1</h2>
<h2>Column 1</h2>
</div>
<div class="column">
<h2>Column 2</h2>
<h2>Column 2</h2>
<h2>Column 2</h2>
</div>
<div class="column">
<h2>Column 3</h2>
<h2>Column 3</h2>
<h2>Column 3</h2>
</div>
</div>
</body>
</html>

আউটপুট

উপরের কোডটি নিম্নলিখিত আউটপুট −

তৈরি করবে

কিভাবে সিএসএস দিয়ে সমান উচ্চতার কলাম তৈরি করবেন?


  1. কিভাবে CSS দিয়ে একটি কুপন তৈরি করবেন?

  2. কিভাবে CSS দিয়ে তীর তৈরি করবেন?

  3. কিভাবে CSS দিয়ে প্রতিক্রিয়াশীল কলাম কার্ড তৈরি করবেন?

  4. কিভাবে CSS দিয়ে একটি মিশ্র কলাম লেআউট গ্রিড তৈরি করবেন?