小编Mil*_*n C的帖子

使用 Tailwind CSS 将文本和图标放在同一行？

我试图获取左侧的文本和右侧的图标，但现在图标位于文本上方，请参见第一张图片。我希望图标位于 \xe2\x80\x9c 项目名称\xe2\x80\x9d 右侧的右上角，并且文本与第二张图片类似。

\r\n

<!-- Tailwind -->\n<link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">\n\n\n<!-- Body -->\n<div class="flex card bg-neutral h-48 px-3 hover:bg-primary">\n  <svg class="h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">\n    <path stroke-linecap="round" stroke-linejoin="round" d="M10 6H6a2 2 0 00-2 2v10a2 2 0 002 2h10a2 2 0 002-2v-4M14 4h6m0 0v6m0-6L10 14" />\n  </svg>\n  <h2 class="text-2xl font-bold text-white py-3">Project name</h2>\n  <p class="text-left py-4 font-bold group-hover:bg-primary">Explaination of the project</p>\n  <p class="text-left pb-4 font-bold">Tag, tag, tag</p>\n</div>

Run Code Online (Sandbox Code Playgroud)\r\n

\r\n