CSS center content within a div

Here's an old bit of code that I found to position something centrally inside an element.

#idOfTheDiv {
    width: 400px; /* here you put the width that you need */
    height: 200px; /* here you put the height that you need */
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -200px; /* this number always to be the width divided two in negative */
    margin-top: -100px; /* this number always to be the height divided two in negative */
}

Clive Walkden

Posted: 23 July 2001

Latest Articles

Linux — 30 October 2023

How to Install NordLayer VPN Client on Ubuntu 20.04 and Connect to a Virtual Network

A simple to follow installation guide for NordLayer VPN

Clive Walkden

Author

MySQL — 26 July 2023

Mastering MySQL Database Imports on Linux

Learn efficient ways to import MySQL databases on Linux using the mysql command-line client. Explore the --source option and < operator for seamless data migration. Master MySQL imports on Linux with our comprehensive guide.

Clive Walkden

Author

DevOps — 2 May 2023

Mastering SSH Key Conversions for DevOps

A guide to convert SSH keys from one version to another using Linux CLI

Clive Walkden

Author