Task 01 — Play
Experiment A float: left & display: inline-block
All shapes share float: left. Circles use border-radius: 50%.
Experiment B position: absolute inside relative container
Parent is position: relative. Children use top and left.
Experiment C background-image, background-size & float
Wood texture applied via background-image: url(...) with background-size: cover.
Task 02 — Work
CSS Recreation After Sophie Taeuber-Arp — Composition à Rectangles et Cercles, 1931
Pure HTML & CSS. No images, no SVG. Only <div> elements with position, background-color, width, height and border-radius.
CSS properties used:
border-style: solid ·
border-color: #111 ·
border-width: 4px ·
border-radius: 50%