CSS Battle #4 – Ups n Downs

[meg-gutshall]

Link to battle:

Let's battle! ⚔️

Copy the code block below to format your comment on the discussion thread:

<details>
<summary>Code Source  – <strong>score {character count}</strong></summary>
<!-- have to be followed by an empty line! -->

```html
your cssbattles code here!
```

</details>

What others will see:

This will result in a nice hidden bit like so:

Code Source – score {character count}

your cssbattles code here!

[meg-gutshall]

Griddy!! – 617.72 {327}

<div></div><div class=r></div><div></div>
<style>
  body {
    background: #62306D;
    margin: 50px;
    display: grid;
    grid-template: 1fr / 1fr 1fr 1fr;
  }
  div {
    width: 100px;
    height: 200px;
    border-radius: 50px;
    background: linear-gradient(#62306D 50%, #F7EC7D 0);
  }
  .r { rotate: 180deg; }
</style>

Refactored and minified – 660.03 {199}

<div></div><div r></div><div></div><style>body{background:#62306D;display:flex;margin:50}div{width:100;height:200;border-radius:1in;background:linear-gradient(#62306D 50%,#F7EC7D 0)}[r]{rotate:180deg