IMAGE RESIZER CODE

.image-resizer { max-width: 400px; margin: 40px auto; padding: 20px; border: 2px solid #4CAF50; border-radius: 10px; background-color: #f0f8ff; text-align: center; } .resize-options { margin: 20px 0; } .resize-options label { margin: 0 10px; color: #333; } input[type="number"] { width: 80px; padding: 5px; border: 1px solid #ccc; border-radius: 5px; } button { padding: 10px 20px; margin: 10px 5px; border: none; border-radius: 5px; background-color: #4CAF50; color: white; cursor: pointer; } button:hover { background-color: #45a049; } button:disabled { background-color: #cccccc; cursor: not-allowed; } #preview img { max-width: 100%; margin-top: 20px; border: 1px solid #ddd; border-radius: 5px; }