CSS でテキスト列を作成する方法: CSS のみ、それとも JavaScript?

div.multi {
  column-count: 3;
  column-gap: 10px;
  column-rule: 1px solid black;      
}

// Get the content div
const content = document.querySelector(".content");

// Count the number of paragraphs
const paragraphs = content.querySelectorAll("p");

// Split the paragraphs into two equal arrays
const firstHalf = paragraphs.slice(0, Math.floor(paragraphs.length / 2));
const secondHalf = paragraphs.slice(Math.floor(paragraphs.length / 2));

// Float the second half of the paragraphs right
secondHalf.forEach((paragraph) => {
  paragraph.style.float = "right";
});