x
<html><head><style>.button { background-color: #04AA6D; /* Green */ border: none; color: white; padding: 15px 32px; text-align: center; text-decoration: none; display: inline-block; font-size: 16px; margin: 4px 2px; cursor: pointer;}.button1 {width: 250px;}.button2 {width: 50%;}.button3 {width: 100%;}</style></head><body><h2>Set Button Widths</h2><p>Use the width property to change the width of the button:</p><button class="button button1">250px</button><br><button class="button button2">50%</button><br><button class="button button3">100%</button><p><strong>Tip:</strong> Use pixels if you want to set a fixed width and use percent for responsive buttons (e.g. 50% of its parent element). Resize the browser window to see the effect.</p></body></html>