Back
Syntax
Study
Editor
Mode:
HTML
CSS
JavaScript
PHP
Reset
Run »
HTML / CSS / JS
<!DOCTYPE html> <html> <head> <style> body { font-family: Arial; padding: 20px; } .center { display: flex; justify-content: center; align-items: center; height: 120px; background: #ede9fe; border-radius: 8px; margin-bottom: 12px; } .between { display: flex; justify-content: space-between; align-items: center; padding: 16px; background: #d1fae5; border-radius: 8px; margin-bottom: 12px; } .item { padding: 12px 20px; background: #6366f1; color: white; border-radius: 6px; } </style> </head> <body> <div class="center"> <div class="item">Perfectly Centered</div> </div> <div class="between"> <div class="item">Logo</div> <div class="item">Nav Links</div> </div> </body> </html>
Result
Open