CSS Battle Solutions

December 2024

28 solutions completed this month

Target #336

146b
Sunday, December 1, 2024
medium
View CSS (146 bytes)
*{background:#0B2429}&,p{border:53q solid#0000;border-top:85q solid#4A7D7B;margin:110 150}p{scale:-1;margin:-138 42;-webkit-box-reflect:right 106q

Target #337

222b
Monday, December 2, 2024
easy
View CSS (222 bytes)
p{position:fixed;padding:10 30;margin:20-20}*{background:#E0E7FF;*{background:#0B2429}+*{color:D96C7B;margin:120 190;box-shadow:60px 40px,40px 60px,20px 80px,-60px 40px,-40px 60px,-20px 80px;-webkit-box-reflect:above -60px

Target #338

152b
Tuesday, December 3, 2024
medium
View CSS (152 bytes)
*{background:#5DBCF9;*{background:#fff;margin:90 180;p,a{position:fixed;margin:-90-140;padding:150 20;a{margin:70-180;padding:20 120;+a{margin:-110-180}

Target #340

189b
Thursday, December 5, 2024
medium
View CSS (189 bytes)
*{background:#F2EAA8;*{background:linear-gradient(#7E6293 50%,#DE6B67 0);border-radius:50%;margin:50 175 50 25;p{position:fixed;padding:25;margin:75 300;+p{scale:-1;padding:50;margin:50 200

Target #341

134b
Friday, December 6, 2024
medium
View CSS (134 bytes)
body{background:#0B2429;display:grid;margin:60 110}p{margin:0;background:#F3AC3C}[a]{border-radius:70q 0}[b]{border-radius:70q 70q 0 0

Target #342

101b
Saturday, December 7, 2024
medium
View CSS (101 bytes)
&{background:radial-gradient(circle,#fff 40px,#0B2429 0 100px,#63A3A0 0);box-shadow:inset 0-150px#fff

Target #343

125b
Sunday, December 8, 2024
medium
View CSS (125 bytes)
*{background:linear-gradient(#6255AA 50%,#DBD7F6 0);*{padding:100 125}+*{scale:-1;margin:50 75;p{scale:-.4-.5;margin:-100-125

Target #344

147b
Monday, December 9, 2024
medium
View CSS (147 bytes)
*+*{color: A52F28;background:#F0DAC1;margin:90 140;border:solid;border-right-color:#0000;border-width:90 80;box-shadow:-160px -60px#C3463D,-160px 0

Target #345

139b
Tuesday, December 10, 2024
medium
View CSS (139 bytes)
&{background:#5DBCF9;color:5DBCF9;margin:60 226 140 34;box-shadow:96px -38q#C3463D,203q 85q,96px 123q#C3463D,0 85q,203q 0,0 0 0 240q#FADE8B

Target #346

230b
Wednesday, December 11, 2024
easy
View CSS (230 bytes)
*{background:#FFF6D2;*{border:15q solid#67645E;margin:60 110;border-radius:21q;p{position:fixed;padding:110 7;border:0;color:E88933;margin:-34 -11;box-shadow:21q 0,53q 0,85q 0,116q 0,148q 0;z-index:-1;+p{rotate:-90deg;margin:46 69

Target #347

126b
Thursday, December 12, 2024
medium
View CSS (126 bytes)
*+*{background:#6255AA;display:flex;margin:63 39;p{margin:7;background:#CF81AF;padding:20;height:0;+p{padding:40;+p{padding:80

Target #348

208b
Friday, December 13, 2024
easy
View CSS (208 bytes)
*{background:var(--b,#61A74E);border-radius:var(--r, 1in);position:fixed}b{padding:60 20;margin:-60-20;--b:#61A74E}p{padding:90;--b:#FADE8B;margin:22 102;+p{padding:30 90;--r:1in 0;margin:188 102;rotate:30deg

Target #349

173b
Saturday, December 14, 2024
medium
View CSS (173 bytes)
*{background:#2F5A76;+*{background:#F5BB60;color:F5BB60;margin:100 150;rotate:45deg;box-shadow:0 21q#2F5A76,21q 0#2F5A76,0 -21q#2F5A76,-21q 0#2F5A76,0 53q,53q 0,0-53q,-53q 0

Target #350

125b
Sunday, December 15, 2024
medium
View CSS (125 bytes)
*{background:#F0F0F0;border:solid#E05947;border-width:30 0 30 30;margin:50 75;*{border-radius:2in 0 0 2in;margin:-30 0-30 120

Target #351

159b
Monday, December 16, 2024
medium
View CSS (159 bytes)
&{background:radial-gradient(1q at 50%42%,#222 40px,#FADE8B 0 74q,#222 0);margin:99 75 80;border-inline:80q solid#FADE8B;box-shadow:0 32q#222,0 0 0 212q#FADE8B

Target #352

211b
Tuesday, December 17, 2024
easy
View CSS (211 bytes)
&{color:#588A95;margin:60 110;box-shadow:inset 24px 24px#fff,inset 48px 48px, inset 72px 72px#fff,inset 96px 96px,inset 120px 120px#fff,inset 144px 144px,inset 168px 168px#fff,inset 182px 182px,0 0 0 212q#588A95

Target #353

165b
Wednesday, December 18, 2024
medium
View CSS (165 bytes)
*{background:#FAE29E;width:0;height:0;margin:80 98;border-top:70px solid#0000;border-right:86px solid#EA9A52;border-bottom:70px solid#0000;+*{scale:-1;margin:-70 118

Target #355

157b
Friday, December 20, 2024
medium
View CSS (157 bytes)
*{background:#3F4869;+*{background:radial-gradient(circle,#0000 0 53q,#61A74E 0 80px,#0000 0)}p{position:fixed;background:#61A74E;margin:42 177;padding:40 15

Target #356

170b
Saturday, December 21, 2024
medium
View CSS (170 bytes)
*{background:#EA9A52;+*{background:radial-gradient(circle,#0000 0 53q,#435998 0 80px,#0000 0)}p{position:fixed;background:#435998;margin:-5 177;padding:55 15;rotate:45deg

Target #358

163b
Monday, December 23, 2024
medium
View CSS (163 bytes)
*{background:#3F4869;border:60px solid#F4DA64;padding:70;transform:matrix(var(--m,1,0,0,1,80,-65));+*{border-width:35px;border-radius:30q;--m:1.73,-1,1.73,1,99,-28

Target #359

170b
Tuesday, December 24, 2024
medium
View CSS (170 bytes)
*{background:radial-gradient(1q,#E0E7FF 53q,#4F77FF 0 95q,#E0E7FF 0 106q,#4F77FF 0 148q, #E0E7FF);*{background:#E0E7FF;margin:130 0 130 160;box-shadow:158q 0 0 21q#E0E7FF

Target #360

177b
Wednesday, December 25, 2024
medium
View CSS (177 bytes)
p{padding:45 55;translate:-145px 0;rotate:90deg}*{background:#D96C7B;*{margin:105 115;border-inline:1.9em solid#fff;color:D96C7B;box-shadow:-10px 0,10px 0,-40px 0#fff,40px 0#fff

Target #361

159b
Thursday, December 26, 2024
medium
View CSS (159 bytes)
*{background:#5393BD;margin:50 100;border:solid#FAE29E;border-width:0 0 var(--r,30px)30px;*{position:fixed;rotate:-45deg;translate:-93px -63px;padding:80;--r:0

Target #362

145b
Friday, December 27, 2024
medium
View CSS (145 bytes)
&{background:#61A74E;margin:30 120;border-inline:40px solid#EFF8FE;p{margin:40-170;padding:20 0;background:#EFF8FE;-webkit-box-reflect:below 80px

Target #363

188b
Saturday, December 28, 2024
medium
View CSS (188 bytes)
*{background:var(--b,#3F4869); ;p{position:fixed;border-radius:20px 20px 20px 0;--b:#61A74E;margin:52 102;padding:80 30;+p{--b:#EA9A52;padding:30 90;+p{--b:#AA3440;margin:172 102;scale:1-1

Target #364

170b
Sunday, December 29, 2024
medium
View CSS (170 bytes)
*{background:var(--b,#7C9A81);+*{margin:105 65;--b:#FFF9C6;border-radius:1in;p{translate:70px;padding:45;--b:radial-gradient(circle,#EFCB5C 35px,#7C9A81 35px 65px,#0000 0

Target #365

123b
Monday, December 30, 2024
medium
View CSS (123 bytes)
&{background:radial-gradient(circle,#0000 26%,#3F4869 0),radial-gradient(circle at 25%,#3F4869 64px,#978963 0 28%,#EFCB5C 0

Target #366

111b
Tuesday, December 31, 2024
medium
View CSS (111 bytes)
*{background:#328FC1;+*{background:#FADE8B;border-radius:1in;margin:-99 0 25 250;-webkit-box-reflect:left 100px