css Drawing Experiment

by Erik Wiessmann

Setup

Set up a website, and css file.

The website is quite simple, we just place a whole bunch of div tags in the body in a flex container.

lots of div tags!

Plan

The plan is to make all of the div tags black or white. When you mouse over a div tag change the color to an on state. Then have the return color slowly change back.

css

Hide overflow in the css. If the page scrolls it feels less polished.

Set up the flex container. Flex containers wrap the webpages content automaticalle. You may read about these online.

Set up the div tag, change the attributes as you see fit.

Set the hover and active tag of the div tag to turn the div tag on

javascript (optional)

The only thing we use javascript here makes the mobile experience better.