Copied information from the CodePen:
Grid using custom properties for columns and rows.
It also features are drag to resize, using a simple drag-handle.
The resize is snapped to the grid spans.
Browser support baseline-status added for transparency.
Here's the revised version of the DEV.to post with code blocks added for key parts:
Grid with Custom Properties and Resizable Elements
Hello, DEV community! 👋
I've been experimenting with CSS grids lately, and I want to share a fun project:
: Adapt layouts based on a container's size rather than the viewport.
: Control the maximum number of lines displayed in a block element.
MDN: Transition Behavior - Allow-Discrete: Define how discrete values change during transitions.
I’d love to hear your feedback or ideas for further improvements! Let me know what you think in the comments, or feel free to fork the Pen and make it your own. 😊
Happy coding! 💻✨
SOCIAL SHARE CARD GENERATOR