CSS column-span প্রোপার্টি দিয়ে এলিমেন্টকে একাধিক কলামে ছড়িয়ে দিন

একটি এলিমেন্ট কতগুলো কলামে ছড়িয়ে থাকবে তা নির্ধারণ করতে column-span প্রোপার্টি ব্যবহার করা হয়। মান হিসেবে all দিলে এলিমেন্টটি সব কলামের উপর ছড়িয়ে যাবে।

উদাহরণ

নিচের কোডটি চালিয়ে column-span প্রোপার্টির ব্যবহার দেখুন:

<!DOCTYPE html> <html> 
  <head> 
    <style> 
      .demo { 
        column-count: 4; 
        column-rule-color: maroon; 
        column-rule-style: dashed; 
      } 
      h1 { 
        column-span: all; 
      } 
    </style> 
  </head> 
  <body> 
    <div class="demo"> 
      <h1>This is our heading.</h1> 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
      This is demo text. This is demo text. This is demo text. This is demo text. 
    </div> 
  </body> 
</html>

ব্যাখ্যা: h1 এলিমেন্টে column-span: all; সেট করা হয়েছে, তাই হেডিংটি ৪টি কলামের উপরে পুরো প্রস্থে ছড়িয়ে থাকবে।