Follow

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use
Contact

Tailwind CSS Grid Cell Growing

I am a beginner on TailwindCSS here, and I need to build a grid with "Cards" which might need to accomodate a large description, the idea is to have a "more" link which will display the whole description. My problem is when one of the cells is growing, all the cells in the same row grow at the size of the expanded one. I would like that only the expanded cell border grows but the rest remain collapsed.
It is ok if the whole row is expanded, the thing is the border should remain collapsed. Probably is more a CSS than a Tailwind thing but as I said, I am a beginner here.

HTML (https://codepen.io/telit0/details/WNdbwMG)

Actual view

MEDevel.com: Open-source for Healthcare and Education

Collecting and validating open-source software for healthcare, education, enterprise, development, medical imaging, medical records, and digital pathology.

Visit Medevel

>Solution :

One simple solution would be using items-start from tailwind itself

Demo

There are also items-end, items-center, items-baseline, item-stretch, depending on how you need to align your content vertically within your grid items.

Add a comment

Leave a Reply

Keep Up to Date with the Most Important News

By pressing the Subscribe button, you confirm that you have read and are agreeing to our Privacy Policy and Terms of Use

Discover more from Dev solutions

Subscribe now to keep reading and get access to the full archive.

Continue reading