Build your Own Cheatsheet Challenge Project (HTML, CSS)

This looks Amazing! I wish i thought of that! Great Job!

1 Like

Thank you so much! @ashrp91 I’m glad you liked my project. Just a tip for you: before embarking on any project, I find it helpful to explore other people’s work for inspiration. It’s a great way to activate creativity and sometimes provides that extra spark needed for new ideas. :smiling_face:

Nice! Very good job. :clap:

Nice! Very good job, I loved the way you explained about HTML and CSS.

Here is the link to my cheatsheet project, please rate it!

1 Like

Here is my Cheatsheet Challenge Project: Ken's Cheat Sheet
What y’all think?

1 Like

I appreciate your feedback, I was thinking at first sight to make it simple. Well, it got complicated, but at the end it went super cool

1 Like

Here is my Cheatsheet. Rate it if you want.

hello! i just complete my cheat sheet

here you can see it live on github: how to use the tables in html and box model in css
and here you can see the code: GitHub - massarovisuals/cheatsheet: front-end cheat sheet

im still working on the last part of the code trying to make the texts align to each other

I don’t think that naming as Tag is correct in this table. If you imply of those rules such as color or text decoration color in CSS, you can use naming as Property.

1 Like

Just completed my cheatsheet.

Here’s the live link:

Hi guys! This is my first post in the forum.
I’m djsurgeon from Spain and this is my project.

Web Page

Source Code


Here’s mine!

1 Like

Hello!!! This is my code for the CheatSheet Project! I tried to do it as simple as i could. For now it just has the most common HTML tags. I’ll update it in the future with more information! Click on the link to check out the repo and feel free to make recommendations!


Here’s mine :smile:



Hey there all!

Hope you are well.

Here is my attempt at a cheatsheet - Specifically focusing on HTML tags:

Github: GitHub - Only-Codes/html-cheatsheet: A cheat sheet created for a range of html tags
And live: My HTML Tag Cheatsheet

direct site


link to my project

hello everyone! i just finished my task. would be glad to see some criticism and comments

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Cheat Sheet Codecademy</title> <link href="./styles.css" rel="stylesheet"> <link href="" rel="stylesheet"> </head> <body> <header> <h1>Just a Cheat Sheet</h1> </header> <main> <div class="table_pad_1"> <table id="table_1"> <caption> ./bash_commands </caption> <thead> <th scope="col" id="first_col">command</th><th scope="col" id="second_col">description</th> </thead> <tbody> <tr><th scope="row">/pwd</th><td>print working directory</td></tr> <tr><th scope="row">/cd</th><td>change directory</td></tr> <tr><th scope="row">/ls</th><td>list files and dirs</td></tr> <tr><th scope="row">/mkdir</th><td>create new directory</td></tr> <tr><th scope="row">/touch</th><td>create new files</td></tr> <tr><th scope="row">/clear</th><td>clear workspace</td></tr> <tr><th scope="row">/echo > </th><td>adds text inside a file</td></tr> <tr><th scope="row">/echo >> </th><td>rewrites file with a new text</td></tr> <tr><th scope="row">/cat</th><td>shows text in file</td></tr> </tbody> </table> </div> <div class="table_pad_2"> <table id="table_2"> <caption> how to add a shadow </caption> <thead> <th scope="col" id="first_col">parameter</th><th scope="col" id="second_col">name</th><th scope="col" id="third_col">effect</th> </thead> <tbody> <tr><th scope="row" colspan="3">box-shadow: </th></tr> <tr><th scope="row">none</th><td colspan="2">no shadow</td></tr> <tr><th scope="row">&lt;color&gt; &lt;length&gt; &lt;length&gt;</th><td>A color and two length values</td><td>first value = x value, second = y</td></tr> <tr><th scope="row">&lt;length&gt; &lt;length&gt; &lt;length&gt; &lt;color&gt;</th><td>Three length values and a color</td><td>same + third value = blur length</td></tr> <tr><th scope="row">&lt;length&gt; &lt;length&gt; &lt;length&gt; &lt;length&gt; &lt;color&gt;</th><td>Four length values and a color</td><td>same + fourth value = spread radius</td></tr> <tr><th scope="row">inset + lengths + colors</th><td colspan="2">changes the shadow from an outer box-shadow to an inner box-shadow</td></tr> </tbody> </table> </div> </main> </body> </html>
* { padding: 0; margin: 0; text-align: center; } body { background-color: bisque; } h1{ margin: 40px; font-style: sans-serif, monospace; text-shadow: 10px 10px 20px aqua, -10px -10px 20px aqua; color: gold; } .table_pad_1 { padding: 30px; background-color: black; width: 50%; margin: 50px auto; border-radius: 20px; box-shadow: 10px 20px 15px gray; } #table_1 { background-color: black; border: 2px solid; border-collapse: collapse; font-family: 'VT323', monospace; margin: 0px auto; color: white; width: 95%; } #table_1 caption { caption-side: bottom; background-color: black; padding-top: 20px; } th, td { border: 2px solid; padding: 5px 5px; font-weight: 400; } td { width: 250px; } #first_col { padding: 0; width: 40%; background-color: white; color: black; border-color: white; border-right-color: black; } #second_col { background-color: white; color: black; border-color: white; border-right-color: black; } #third_col { background-color: white; color: black; border-color: white; } .table_pad_2 { padding: 30px; background-color: pink; width: 80%; margin: 50px auto; box-shadow: inset 0px 100px 30px lightblue; } #table_2 { border: 2px solid; border-collapse: collapse; font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif; margin: 0px auto; color: white; width: 95%; } #table_2 caption { caption-side: bottom; padding-top: 20px; }

Hey y’all!
Here is my project! Very simple but I’m excited about it!

Hi, hazalonler. Thank you for your review, could you show me how can I change? I didn’t understand.