CSS Battle Solutions

A collection of my solutions for CSS Battle challenges, along with a built-in CSS minifier tool.

What is CSS Battle?

CSS Battle is a competitive coding platform where you recreate visual targets using only HTML and CSS. The goal is to achieve the highest visual accuracy with the least amount of code.

Project Structure

• solutions: My CSS Battle challenge solutions (to be added)
• minifier/: Built-in CSS minifier tool for optimizing code length

CSS Minifier

The project includes a CSS minifier tool that helps optimize CSS code for CSS Battle submissions by:

• Removing unnecessary whitespace and newlines
• Removing closing tags (optional)
• Removing px units from common properties
• Removing unnecessary quotes from attributes
• Removing trailing semicolons before closing braces
• Removing trailing )} characters

Using the Minifier

1. Open minifier/index.html in your browser
2. Paste your CSS code in the left textarea
3. The minified version appears automatically on the right
4. Use the "Copy" button to copy the minified code
5. Toggle "Remove closing tags" as needed

Getting Started

1. Clone this repository
2. Open minifier/index.html to use the CSS minifier
3. Add your CSS Battle solutions to the project