TIL

Today I learned...

#learnings

A collection of byte-sized knowledge I frequently reference.

Example

An example of a TIL entry

Apr 21, 2023

Here is my first entry. Testing this out. I can add code too:

const message = "Hello, World!"
console.log(message);

Tailwind center text layout

How to center text in the middle of the screen using Tailwind CSS

Apr 21, 2023

The following code snippets can be used to achieve a result similar to the screenshot below:

To preview this, visit stamos.xyz

#HTML

<div className="flex min-h-screen items-center justify-center bg-white dark:bg-black">
    <div className="mx-auto max-w-2xl text-center">
        <p className="text-black dark:text-white">
            This text will be in the center of the screen
        </p>
    </div>
</div>

#React

export default function Layout() {
    return (
        <div className="flex min-h-screen items-center justify-center bg-white dark:bg-black">
            <div className="mx-auto max-w-2xl text-center">
                <p className="text-black dark:text-white">
                    This text will be in the center of the screen
                </p>
            </div>
        </div>
    )
}