Search
Star
Feedback
Setup for Free
© 2026 Hedgehog Software, LLC
Twitter
GitHub
Discord
System
Light
Dark
More
Communities
Docs
About
Terms
Privacy
Grid layout to cover spacing with Header/Footer/Content - Kevin Powell - Community
KP-C
Kevin Powell - Community
•
2y ago
•
2 replies
CDL
Grid layout to cover spacing with Header/Footer/Content
This is my attempt with a very basic layout
.
.
. I have a flex version which I think is ok
, but this is how I
've managed the grid version
.
.
https://codepen.io/Laing91/pen/dyEzGLo
I realized the elements were stacking without flexbox
, so I
've flexed the child elements of the grid container so that they default to row and can be spaced out etc
.
.
flex version if interested
:
https://codepen.io/Laing91/pen/WNWvagz
CodePen
Callum
Header/Content/Footer spacing CSS Flexbox
.
.
.
Kevin Powell - Community
Join
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263
Members
View on Discord
Resources
ModelContextProtocol
ModelContextProtocol
MCP Server
Recent Announcements
Similar Threads
Was this page helpful?
Yes
No
Similar Threads
Grid Spacing
KP-C
Kevin Powell - Community / front-end
3y ago
CSS Grid footer columns layout wrapping
KP-C
Kevin Powell - Community / front-end
2y ago
Responsive 2 column layout with header and footer
KP-C
Kevin Powell - Community / front-end
2y ago
Help with footer layout
KP-C
Kevin Powell - Community / front-end
3y ago