< Back to Frontend Friday Folks Index

Corona Virus

Visit the official puzzle page (affiliate link!) to play it yourself. If you buy a course from CSSBattle through my affiliate link, I receive a share of it!

Highlighted solution (654 characters)
1 
<div a></div>
2 
<div b></div>
3 
<div c></div>
4 
<p>
5 
<style>
6 
  &{background:#1A4341}
7 
  div {
8 
    position:fixed;
9 
    border:5px solid #F3AC3C;
10 
    border-radius: 5px;
11 
    top:50px;
12 
    left:195px;
13 
    height:170;
14 
  }
15 
  [b] {
16 
    transform: rotate(-60deg);
17 
    transform-origin: 23px 90px;
18 
  }
19 
  [c] {
20 
    transform: rotate(-120deg);
21 
    transform-origin: 11px 90px;
22 
  }
23 
  p{
24 
    position:fixed;
25 
    inset:0;
26 
    background:
27 
      radial-gradient(1q,#998235 5px, #3210 0) 25px -25px,
28 
      radial-gradient(1q,#998235 10px, #3210 0) 0 25px,
29 
      radial-gradient(1q,#998235 15px, #3210 0) -15px -15px,
30 
      radial-gradient(1q,#F3AC3C 50px, #3210 0);
31 
  }
32 
</style>
I think we never did this puzzle in VirtualCoffee. Maybe we forgot or the title put us off at the time... Anyways, I solved it like this when I saw that puzzle 47 was still missing in the list!
< Back to Frontend Friday Folks Index