Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
<!DOCTYPE html> <html> <head> <style> *, *::before, *::after { box-sizing: border-box; } body { background: #f8fafc; font-family: Arial; } .wrapper { width: 600px; margin: 0 auto; padding: 20px; } .card { background: white; border: 1px solid #e5e7eb; border-radius: 8px; padding: 24px; margin-bottom: 16px; } .btn { display: inline-block; padding: 10px 20px; background: #6366f1; color: white; border-radius: 4px; margin: 4px; } </style> </head> <body> <div class="wrapper"> <div class="card">Card 1 — padding: 24px, margin-bottom: 16px</div> <div class="card">Card 2 — centered wrapper with margin: 0 auto</div> <div> <span class="btn">Button A</span> <span class="btn">Button B</span> </div> </div> </body> </html>
Result
Open