Red Button Background CSS
User
CancelDelete
i want second button to background red
i want second button to background red
Assistant
To make the second “ have a red background, you can use CSS like this:
### ✅ Option 1: Inline CSS (quick fix)
<div class="ui-dialog-buttonset">
<button type="button">Cancel</button>
<button type="button" style="background-color: red; color: white;">Delete</button>
</div>### ✅ Option 2: Using a class (recommended for styling consistency)
<style>
.danger-button {
background-color: red;
color: white;
border: none;
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
}
</style>
<div class="ui-dialog-buttonset">
<button type="button">Cancel</button>
<button type="button" class="danger-button">Delete</button>
</div>Let me know if you're using a framework like jQuery UI or Bootstrap, and I can match the style more precisely.
User
we can not give class
Assistant
If you **cannot add a class**, you can still style the second button using CSS by targeting it based on its position within the `.ui-dialog-buttonset` using a `:nth-child` selector.
### ✅ CSS to make the second button red:
<style>
.ui-dialog-buttonset button:nth-child(2) {
background-color: red;
color: white;
border: none;
padding: 6px 12px;
border-radius: 4px;
cursor: pointer;
}
</style>This will style the second “ inside `.ui-dialog-buttonset` without needing a class.
Let me know if you want a hover effect or transition too.