DEV Community

Oliver Kühn
Oliver Kühn

Posted on

100 div curtain effect

My small contribution for the September 2020 CodePen Challenge. Hope you like it!

  • pure CSS
  • grid layout
  • view port always covered (portrait or landscape doesn't matter)
  • every curtain div own correct --col and --row custom properties
  • transition duration is calculated from values of --col and --row
  • interactivity handled through a checkbox, label and the CSS sibling combinator
  • div labels generated by a CSS counter

Top comments (0)