I have this button:
<button onClick={() => removeTask(task)} class="text-xs text-red rounded-full">Delete</button>
I'd like to see something like this: https://tailwindcss.com/docs/border-radius#pill-buttons
However, I don't get the pill-shaped button:
index.css
@tailwind base;
@tailwind components;
@tailwind utilities;
tailwind.config.js
module.exports = {
content: ["./src/**/*.{html,js,jsx}"],
theme: {
extend: {},
},
plugins: [],
};
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
In order to see the "pill" shape, your button needs a border or background color. You could try something like this:
Sandbox example:https://play.tailwindcss.com/j6K2e6ZL0J