Jealous Developers Wonder About the Purpose of a CSS Project

All web designers and developers know that the div tag is a simple statement that defines sections or divisions; it can be used for quite a few purposes such as grouping paragraphs, establishing blocks, and creating multiple layouts within a page. Seasoned coders know that div tags should be kept to a minimum whenever possible, but a developer named Lynn Fisher recently showed off an amazing project consisting of cascading style sheet drawings all nested within a single div.

When you load Lynn Fisher's project, the first thing you will notice is how quickly it renders. Within a single div, Fisher is collecting dozens upon dozens of cool illustrations made with CSS and scalable vector graphics; as such, there are only a few kilobytes of data to render, and the scrolling is incredibly smooth for a project of this scope. Since SVG images are essentially equations, there is not that much to load. Compare this single div CSS project to your average YouTube page, which is at least 10 megabytes and could easily push the limits of old hardware.

Fisher really shows off her CSS illustration skills in this project. One particular image that has caught the attention of many developers is a Tesla Cybertruck that uses nothing but gradients. All the code for this project can be evaluated at GitHub, and it is wonderful. You will certainly want to bookmark Fisher's single div website because she continues to add new SVG illustrations quite often.

Some developers, mostly jealous ones, wonder about the true purpose of this project. While it can be considered as a work of art, the goal is to encourage others to experiment with CSS and SVG. Every image in this project takes up exactly on div; you could argue that it is not practical because there are quite a few sophisticated image editing applications that can be used to create illustrations, but that isn't the point. The tools Lynn uses include Pug.JS for the templates and Stylus for the CSS drawings, but Fisher does a lot of coding by hand; she encourages visitors to copy and paste as much as they want. For more information click here https://a.singlediv.com/.