DEV Community

Prakhar Tandon
Prakhar Tandon

Posted on • Updated on

Started with CSSbattle (Target#1)

Hey folks,
Today I started with CSSBattle, the CSS challenge game.
Its actually fun and interesting.

I recommend all CSS enthusiasts, to spend some time there, it will definitely boosts your skills.

Here's the first Target (You can have a try here).

My personal best was 84 characters(after removing the white-spaces)in this challenge.

Here's two best possible approaches I could come up with.

<p></p>
<style>
*{background:#5d3a3a;margin:0 66.6 0 0}
p{height:200;background:#b5e0ba
Enter fullscreen mode Exit fullscreen mode

And here's with 85 characters.

<p></p>
<style>
*{background:#5d3a3a;margin:0}
p{width:50%;height:200;background:#b5e0ba
Enter fullscreen mode Exit fullscreen mode

NOTE.
There are some tricks regarding the platform such as :

  • You don't need to add a semicolon at the end of last property of a block.
  • You don't need to close the last curly brace.
  • No need of closing the style tag.
  • You don't need to write px as it's the default unit.

Although the top solution was just 54 characters, I wonder how they were able to do it in such small amount of code!

Comment down your way of doing the same.
Stay Tuned for daily updates regarding all the challenges on CSSBattle.

Want to connect? :

Connect with me here.

Discussion (0)