Build your Own Cheatsheet Challenge Project (HTML, CSS)

java9640487346 · April 20, 2022, 2:19pm

First time posting from github, hoping this is right
I did not do the task completly right, but I needed this for myself …And at least it is a table

dazzae · April 20, 2022, 9:15pm

Hello, I am Christian Marín.
I’ve done the cheatsheet for flexbox. I’m pretty sure I will add more ideas, and info as soon as possible.

Flexbox ~ cheatsheet.

Give me feedback, it is welcomed.
Christian Marín.

microace86333 · April 21, 2022, 2:31am

This was an awesome project, loved the liberty to apply what I learned! Check out my Box Model Cheat Sheet, feedback is more than welcomed!

Box Model Cheatsheet

kirbywalper592460167 · April 21, 2022, 3:17am

Hey,

I just finished doing the project (I think) but not sure if I should add more to it or not. thoughts?

ramitounsi · April 21, 2022, 4:56pm

Hello
Here is a simple cheatsheet that i created :
https://rami3344.github.io/cheatsheet/

code0165317225 · April 21, 2022, 8:15pm

This project was enjoyable as I continued to learn more about CSS styling within tables. I honestly struggled the most with borders inside of the tables themselves. Any feedback would be greatly appreciated!

Github link: My Cheat-Sheet

jorgerodriguez707979 · April 22, 2022, 12:26am

Here is my gist for the project, I made it in vs code and had the background image in another folder, so its not visible in github

gist.github.com

https://gist.github.com/Madsiggi/d2dd144925626aa7de99d87ba5691dce

index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Html & CSS machete</title>
    <link href="styles.css" rel="stylesheet" />
    <style>
      @import url("https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;400;700&display=swap");

This file has been truncated. show original

style.css

html {
  width: auto;
  height: 100%;
}

body {
  background-image: url("../Cheat-sheet/resources/images/Background.jpg");
  background-size: cover;
  font-family: "Montserrat", sans-serif;
}

This file has been truncated. show original

and here’s live

https://madsiggi.github.io/cheatsheet-html/

the word machete in my country means cheatsheet btw

_Damn · April 22, 2022, 9:34am

Hi there! Here is the cheet-sheet that i created, is on Semantic HTML tags and relatives attribute. I chosen this color style cause i find it very comfortable to the view and i think that is helpful for a document that you have to use several times.
I really liked did this project and i’m pretty sure that i’ll update it with other useful cheet-sheet tab asap.

Here the code on Github.

Any feedback and suggest are really appreciate!!

Thank you guys.

seftoken · April 23, 2022, 3:27am

Please rate my cheat sheet and let me know what you think.
this is my first challenge project.

Please DM with any criticisms or advice.

alessandramorita · April 25, 2022, 1:20pm

Hi! I read your codes.

Good job

You can also use “thead” and “tbody” to separate the table parts in your code. I think this can make your code easier to read and be modified, when your code is bigger. This’s not the case for this project, but maybe for a future project.

tgrier6 · April 26, 2022, 7:34pm

Hi guys! I’d love some feedback on my cheatsheet HTML Table Reference !

dirtyditty · April 29, 2022, 3:47am

Go easy on me

https://www.codecademy.com/workspaces/626b61b95d5589696db020be

codeplayer53852 · May 2, 2022, 5:24am

gist.github.com

https://gist.github.com/codecademydev/d06e1116a37f047eef6bff62096573aa

index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="styles.css">
    <title>HTML Table Reference</title>
</head>

This file has been truncated. show original

styles.css

body {
  background-color: gainsboro;
}

/*font*/
body {
  font-family: Arial, Sans-serif;
}

/* header*/

This file has been truncated. show original

megapro74310 · May 2, 2022, 6:17am

Hi,
please take a look at my project:
https://ubik1208.github.io/codeacademyproject1/
all feedback is welcome
cheers,
Łukasz

7124624649 · May 2, 2022, 3:36pm

Hey everyone,
That’s my simple project:
https://mischelll.github.io/cheatsheets/index.html

Mishel

haris_iftikhar · May 3, 2022, 11:58am

Please critique and comment on my HTML/CSS project.
Here is my GitHub Repo:

Live GitHub Page:
https://haris-bit.github.io/BuildYourOwnCheatSheet/

Thanks!

_Damn · May 4, 2022, 8:26am

I changed the Github name so the previous link no longer works. Here the new cheet-sheet link.

christophhwork · May 4, 2022, 6:09pm

Just completed it, was really fun to do and one of the CSS properties I always forget.
Feel free to leave comments or feedback.

Live Github Page:
https://wjxfhsgxfm.github.io/FE-CP-Cheatsheet/

Code:

michael4220377918 · May 5, 2022, 10:36am

I am having trouble with positioning my elements correctly.

I am trying to have a table beside an image or two tables side by side, but I am unable to have them sit nicely next to each other.

It seems the formatting goes awry when I try to use display: inline-block;

I managed to get them to kind of line up using a mix of position: relative; and other commands but it is quite finicky and needs to be updated after every change to the table itself

index.html lines 148-235 are the main culprit, if anyone can tell me how I would simplify that would be great!

github.com

MediumBlock/CSS-cheatsheet/blob/main/index.html

<!DOCTYPE html>
<html>

<head>
  <title>CSS Attributes Cheat Sheet</title>
  <link href='styles.css' rel='stylesheet'>
</head>

<body>
  <h1>CSS Cheat Sheet</h1>
  <h3>CSS Selectors</h3>
  <div class="table1">
    <table>
      <thead>
        <tr>
          <th scope="col">Name</th>
          <th scope="col">HTML Tag</th>
          <th scope="col">CSS Example</th>
          <th scope="col">Description / Key Aspects</th>
        </tr>

This file has been truncated. show original

github.com

MediumBlock/CSS-cheatsheet/blob/main/styles.css

* {
  box-sizing: border-box;
}

body {
  background-color: whitesmoke;
  font-family: calibri;
}

h1 {
  text-align: center;
}

h3 {
  color: darkblue;
  text-align: center;
}

table {
  border: 1px solid steelblue;

This file has been truncated. show original

dishpak3142610762 · May 5, 2022, 8:14pm

Well, just for the history
https://dishpak.github.io/cheatsheed/