We made a video new video on Shadcn UI. Check it out!
CSS: Can you center a div?

Overview

Can you center a div?

GreatFrontEnd has better questions!

We don't create questions because GreatFrontEnd already has the best possible library of questions and we recommend the same to our community.

affiliate

Questions are deprecated!

These are the interview practice questions from the legacy versions of Frontend Hire. Only the ones with a video solution are available. Moving forward, we won't be releasing more questions as this is not our strongest content.

Fork on Stackblitz

Click on the "Fork" button on the bottom-left corner of the editor to fork the code on Stackblitz and to solve this question in a separate browser tab.

Question

This is a classic joke in the CSS community.

"Centering a div" - this phrase might sound simple, but it's a longstanding joke in the CSS community due to the surprising complexity it can involve. Your task is to center the div both horizontally and vertically using CSS.

<div>Center Me</div>

Instructions

  • Write your CSS in the styles.css file to center the div element horizontally and vertically on the page.
  • Your solution should use classic CSS. However, if you prefer, you can opt for TailwindCSS.

Enabling TailwindCSS (Optional)

If you choose to use TailwindCSS, include this script in the head of your index.html file:

<script src="https://cdn.tailwindcss.com"></script>

Notes

  • Consider the different ways to achieve centering in CSS, and feel free to showcase a method that best represents your understanding of CSS.

Resources to Refer

Promote your product or service here

Get in front of thousands of frontend developers and tech enthusiasts with our advertising slots.

GreatFrontEnd has better questions!

We don't create questions because GreatFrontEnd already has the best possible library of questions and we recommend the same to our community.

affiliate

Last updated on

On this page