Discussion
Loading...

Post

Log in
  • About
  • Code of conduct
  • Privacy
  • Users
  • Instances
  • About Bonfire
CSS by T. Afif :verified:
CSS by T. Afif :verified:
@css@front-end.social  ·  activity timestamp 2 weeks ago

💡 CSS Tip!

Create a responsive grid of hexagon shapes with fewer than 15 CSS declarations, minimal HTML, and without media queries!

https://css-tip.com/hexagon-grid/

Improving a 5-year old implementation using modern CSS (corner-shape, sibling-index(), math functions, etc)

#CSS #HTML

Your browser does not support the video tag.
GIF
GIF
Open
GIF

Responsive Hexagon Grid without Media Queries

A few lines of modern CSS to create a responsive grid of hexagon shapes (and more!)
⁂
More from
CSS by T. Afif :verified:
  • Copy link
  • Flag this post
  • Block
Jonathan Schofield
Jonathan Schofield
@urlyman@mastodon.social replied  ·  activity timestamp last week

@css oh wow 🤩

  • Copy link
  • Flag this comment
  • Block

bonfire.cafe

A space for Bonfire maintainers and contributors to communicate

bonfire.cafe: About · Code of conduct · Privacy · Users · Instances
Bonfire social · 1.0.1 no JS en
Automatic federation enabled
Log in
  • Explore
  • About
  • Members
  • Code of Conduct