Toggle navigation
☰
HTML
CSS
Scripting
Database
<!DOCTYPE html> <html> <head> <title>Vertically Aligned Example</title> <style> body { font-family: sans-serif; margin: 20px; } .container { height: 300px; background-color: #e9ecef; border: 2px dashed #adb5bd; /* The Flexbox Magic */ display: flex; align-items: center; /* Centers vertically */ justify-content: center; /* Centers horizontally */ } .content-box { background-color: #007bff; color: white; padding: 20px 40px; font-size: 1.5em; font-weight: bold; border-radius: 8px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); } </style> </head> <body> <div class="container"> <div class="content-box"> Perfectly Centered! </div> </div> </body> </html>
