Tailwind CSS: 알약 모양의 버튼 만들기

Question

다음 버튼이 있습니다:

으아악

다음과 같은 것을 보고 싶습니다. https://tailwindcss.com/docs/border-radius#pill-buttons

그런데 알약 모양 버튼이 안 나오네요:

index.css

으아악

tailwind.config.js

<button onClick={() => removeTask(task)} class="text-xs text-red rounded-full">Delete</button>

Answer 1

"알약" 모양을 보려면 버튼에 테두리나 배경색이 필요합니다. 다음과 같이 시도해 볼 수 있습니다:

으아아아

샌드박스 예시: https://play.tailwindcss.com/j6K2e6ZL0J