How to center an element with CSS

#1

.center {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#2

.center{
    display: flex;
    align-items: center;
    justify-content: center;
}

#3

.center{ 
    display: grid;
    place-items: center;
}
Abhijit Mhasagar

Recent Posts

CSS Grid Template example easy to understand

https://codepen.io/abhijitmhasagar/pen/dyjRwxX # HTML <div class="container"> <div class="box">box 1</div> <div class="box">box 2</div> <div class="box">box 3</div> <div…

1 year ago

Redirect to URL on HTML Select option change

<select class="form-select lang-select" aria-label="Language Change" onchange="this.options[this.selectedIndex].value && (window.location = this.options[this.selectedIndex].value);"> <option disabled>Language</option> <option value="https://google.com" selected>English</option>…

2 years ago

Default WordPress .htaccess

# BEGIN WordPress <IfModule mod_rewrite.c> RewriteEngine On RewriteBase / RewriteRule ^index.php$ - [L] RewriteCond %{REQUEST_FILENAME}…

2 years ago

How to reduce image size online in 1 minute without losing the quality

Go to Photopea | Online Photo Editorclick on FILE > OPEN OR click on OPEN FROM…

2 years ago

Security Headers .htaccess

put it in .htaccess Header always set Strict-Transport-Security: "max-age=31536000" env=HTTPS Header always set Content-Security-Policy "upgrade-insecure-requests"…

2 years ago

How to redirect HTTP to HTTPS Using .htaccess

Redirecting HTTP to HTTPS by Editing .htaccess File Please replace https://www.yourdomain.com with your Domain URL…

3 years ago