This repository demonstrates a bug where the items-center
class in Tailwind CSS doesn't correctly center items vertically within a flex container. The expected behavior is that items-center
should vertically align items to the center, but in this case, it only works for horizontal alignment.
A simple flex container with items-center
and justify-between
is used to align two divs. While the justify-between
works as expected, items-center
fails to center the items vertically.
The solution involves adding the h-full
class to the child divs, ensuring they occupy the full height of their parent. This allows items-center
to work correctly for vertical alignment.