CSS Battle #27 – Lock up

[aishwarya-mali]

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!

[aishwarya-mali]

Radial gradient and after selector – 621.24 {308}

<style>
body{
background:radial-gradient(198px circle at 50% 50%,#AA445F 50%, transparent 51%),#E38F66;
rotate:-45deg;
}
body::after{
content:'';
display:flex;
position:relative;
left:50%;
top:50%;
transform:translate(-50%,-50%);
height:80px;
width:80px;
border-radius:50%;
border:30px solid;
border-color:transparent #F7EC7D;
}

[piotrszymaniec]

minified – 607.96 {411}

<div a><div b></div><div b c><style>[a]:after,[b]{background:#aa445f}[a]:after,[c]{position:relative}body{position:absolute;top:42;left:92;background:#e38f66}[a]{box-sizing:border-box;width:200;height:200;background:#f7ec7d;border-radius:50%;border:30px solid #aa445f}[b]{width:70px;height:70px}[c]{right:-70;bottom:0}[a]:after{content:'';width:80px;height:80px;display:block;top:-110;left:30;border-radius:50%}