小编qua*_*tor的帖子

所以我用 Tailwindcss 和 Postgres 生成了一个全新的 Rails 7 项目

rails new project -d postgresql --css tailwind

然后我搭建了一个任务模型，它生成了漂亮的 CSS。然后我冒险对索引页进行了一些调整，因为脚手架 html/css 将其垂直绘制出来。我正在努力实现更加水平的布局，其中各个任务将形成单独的行。

根据顺风文档，我可以为每个任务使用网格。由于我在任务中有三个属性，因此我想使用三列网格。

所以我添加grid gap-4 grid-cols-3到我的 _task.html.haml

.grid.gap-4.grid-cols-3{:id => "#{dom_id task}"}
  .my-5
    %strong.block.font-medium.mb-1 Description:
    = task.description
  .my-5
    %strong.block.font-medium.mb-1 Notes:
    = task.notes
  .my-5
    %strong.block.font-medium.mb-1 Deadline:
    = task.deadline
  - if action_name != "show"
    = link_to "Show this task", task, class: "rounded-lg py-3 px-5 bg-gray-100 inline-block font-medium"
    = link_to 'Edit this task', edit_task_path(task), class: "rounded-lg py-3 ml-2 px-5 bg-gray-100 inline-block font-medium"
    %hr.mt-6

但它继续将属性呈现在彼此之下。

在尝试了它并试图找出为什么它没有选择样式后，我在 …