Build your Own Cheatsheet Challenge Project (HTML, CSS)

Hi,
Thanks for your suggestion.
Please check now HTML Table Cheat Sheet

2 Likes

Looks Good! Good Job.

1 Like

Here’s my simple cheatsheet project!
https://coreunic.github.io/CheatsheetProject/

Hello there
This is my first HTML (semantic) + CSS project during this course
I wan to share it with the community, please feel free to comment it!

Link to the gist.

Here is mine!

1 Like

Good Afternoon All,

Below is my first stab at this project. Would love to go back and add to/refine on this as I continue through the course!

Matt

By the way, your webpage doesn’t have CSS if you go to the live page.

It’s because when I copied and pasted the code, I linked the index to “styles.css” but forgot to name the new file “styles.css” and its just “style.css.”

Now I can’t figure out how to change the file name in Github.

I changed it but I don’t know if there is wait time as it still doesn’t reflect the CSS that was reflected in CodeAcademy when I did it.

Hello.
Please check out my cheat sheet project.

Hello, I wanted to post my Cheat Sheet Project. It took a bit to make everything align correctly. However, I noticed my title isn’t aligned right on the CSS page. Overall, please feel free to comment!

Live: My Coding Cheat Sheet
File: GitHub - bettytn1/CheatSheetProject-Codecademy

2 Likes

Here it is, and below is the final outcome of the project.
‘Twas fun. Thank you!

Build your Own Cheatsheet Challenge Project

My first page.

<!DOCTYPE html>
<html>
  <head>
    <title>This is my challenge project.</title>
    <link href="styles.css" type="text/css" rel="stylesheet">
  </head>
  <body>
    <h1>Table Project</h1>
    <h2>This is a default table</h2>
    <table>
      <thead>
        <tr>
          <th>Default Table Header</th>
          <th>Secondary Table Header</th>
          <th>Third Table Header</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td>
            <span class="code">&lt;table&gt;</span>
          </td>
          <td>Table</td>
          <td>The wrapper for all HTML tables.</td>
        </tr>
        <tr>
          <td>
            <span class="code">&lt;thead&gt;</span>
          </td>
          <td>Table Head</td>
          <td>The set of rows defining the column headers in a table.</td>
        </tr>
        <tr>
          <td>
            <span class="code">&lt;tbody&gt;</span>
          </td>
          <td>Table Body</td>
          <td>The set of rows containing actual table data.</td>
        </tr>
        <tr>
          <td>
            <span class="code">&lt;tr&gt;</span>
          </td>
          <td>Table Row</td>
          <td>The table row container.</td>
        </tr>
        <tr>
          <td>
            <span class="code">&lt;td&gt;</span>
          </td>
          <td>Table Data</td>
          <td>The table data container.</td>
        </tr>
        <tr>
          <td>
            <span class="code">&lt;tfoot&gt;</span>
          </td>
          <td>Table Foot</td>
          <td>The set of rows defining the footer in a table.</td>
        </tr>
      </tbody>
    </table>
    <h2>Table Attributes</h2>
    <table>
      <thead>
        <th>Attribute</th>
        <th>Name</th>
        <th>Description</th>
      </thead>
      <tbody>
        <tr>
          <td>
            <span class="code">colspan<span>
          </td>
          <td>Column Span</td>
          <td>Defines how many columns a td element should span.</td>
        </tr>
        <tr>
          <td>
            <span class="code">rowspan</span>
            </td>
            <td>Row Span</td>
            <td>Defines how many rows a td element should span.</td>
        </tr>
      </tbody>
    </table>
  </body>
</html>
body {
  background-color: lavender;
  color: DarkSlateBlue;
  font-family: sans-serif, Calibri;
}

.code {
  background-color: lavender;
  font-family: Calibri;
  
}

h1 {
  font-family: Sans-serif;
  text-align: center;
  color: black;
}

h2 {
  color: Indigo;
  text-align: center;
  font-family: "Edwardian Script", 'Cedarville Cursive', sans-serif,
}

table {
  text-align: center;
  border: 1px solid darkblue;
  background-color: white;
  border-collapse: collapse;
  position: relative;
  width: 550px;
  margin: auto;
}

th, td {
  border: 1px solid darkblue;
}
1 Like

My work → https://codepen.io/burakcode/pen/oNdyZxZ

Here is my cheatsheet, my first time replying on here.

Also, also nice to meet you all!