DEV Community

loading...

Flexbox Item Stretching, Oh My!

Vincent Engelmann
I'm a full stack developer and teacher.
・1 min read

To stop an item from stretching vertically in a flexbox container, apply this to the container: align-self: flex-start;.

In tailwindcss, this would be class="items-center" (or any of the other items-{position} classes). Here's a tailwind example:

        <div class="flex items-center">
          <button>Edit</button>
          <button>Delete</button>
        </div>

Ain't no shame in StackOverflow Driven Development.

https://stackoverflow.com/a/33887124/1258020
https://tailwindcss.com/docs/flexbox-align-items

Discussion (0)

Forem Open with the Forem app