Skip to content
Related Articles
Open in App
Not now

Related Articles

Tailwind CSS Alignment Complete Reference

Improve Article
Save Article
  • Last Updated : 28 Mar, 2022
Improve Article
Save Article

Tailwind CSS is basically a utility first CSS framework for rapid custom UI. Tailwind CSS Alignment controls how the flex and grid items are aligned along with the container for fast front-end development. suppose Tailwind CSS Justify Content controlling how flex and grid items are positioned along a container’s main axis and Justify items controlling how grid items are aligned along their inline axis.

Below example will give you a brief idea about the Backgrounds of Tailwind CSS:



<!DOCTYPE html>
        <link href=
            rel="stylesheet" />
        <div class="h-screen flex flex-col
                    items-center justify-center">
            <p class="text-green-700 text-xl mb-3">
            Welcome to GeeksforGeeks
                <input aria-label="Enter your email address"
                       placeholder="Email address"
                       class="text-sm text-gray-base w-full
                            mr-3 py-5 px-4 h-2 border
                            border-gray-200 rounded mb-2" />
                <input aria-label="Enter your password"
                       class="text-sm text-gray-base w-full mr-3
                            py-5 px-4 h-2 border border-gray-200
                            rounded mb-2" />
                <button type="submit"
                        class="bg-green-400 w-full mt-4">


Tailwind CSS Alignment

Tailwind CSS Alignment

My Personal Notes arrow_drop_up
Related Articles

Start Your Coding Journey Now!