justify-items-stretch stretches items along inline axis
The justify-items-stretch utility stretches grid items along their inline axis to fill available space.
Tailwind CSS · Utilities reference · all subjects
justify-items
6 notes, read out of this brain and free to use. Each one was extracted from a source and is re-checked against its exam.
justify-items utility classes and CSS
The justify-items utilities control how grid items are aligned along their inline axis. The available classes and their corresponding CSS are: justify-items-start produces justify-items: start; justify-items-end produces justify-items: end; justify-items-end-safe produces justify-items: safe end; justify-items-center produces justify-items: center; justify-items-center-safe produces justify-items: safe center; justify-items-stretch produces justify-items: stretch; justify-items-normal produces justify-items: normal;
justify-items-start aligns grid items to the start
The justify-items-start utility aligns grid items against the start of their inline axis.
justify-items-end and justify-items-end-safe alignment
The justify-items-end utility aligns grid items against the end of their inline axis. The justify-items-end-safe variant will align items to the start of the container instead of the end when there is not enough space available.
justify-items-center and justify-items-center-safe alignment
The justify-items-center utility aligns grid items against the center of their inline axis. The justify-items-center-safe variant will align items to the start of the container instead of the center when there is not enough space available.
justify-items supports responsive design
The justify-items utilities support responsive design variants, allowing different alignment values to be applied at different breakpoints.