codecademydev/index.html Secret

## index.html
<html lang="en">
  <head>
    <link href="./styles.css" rel="stylesheet" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Cheat Sheet</title>
  </head>
  <header><h1>HTML Table Reference</h1></header>
  <body>
    <div class="tables">
    <div class="table1">
      <h2>Table Tags</h2>
      <table>
        <tbody>
          <tr>
            <th>Tag</th>
            <th>Name</th>
            <th>Description</th>
          </tr>
          <tr>
            <td><p class="td_first_column">&lt;table&gt;</p></td>
            <td>Table</td>
            <td>The wrapper element for all HTML tables.</td>
          </tr>
          <tr>
            <td><p class="td_first_column">&lt;thead&gt;</p></td>
            <td>Table Head</td>
            <td>The set of rows defining the column headers in a table</td>
          </tr>
          <tr>
            <td><p class="td_first_column">&lt;tbody&gt;</p></td>
            <td>Table Body</td>
            <td>The set of rows containing actual table data.</td>
          </tr>
          <tr>
            <td><p class="td_first_column">&lt;tr&gt;</p></td>
            <td>Table Row</td>
            <td>The table row container.</td>
          </tr>
          <tr>
            <td><p class="td_first_column">&lt;td&gt;</p></td>
            <td>Table Data</td>
            <td>The table row container.</td>
          </tr>
          <tr>
            <td><p class="td_first_column">&lt;tfoot&gt;</p></td>
            <td>Table Foot</td>
            <td>The set of rows defining the footer in a table.</td>
          </tr>
        </tbody>
      </table>
    </div>
    <div class="table2">
      <h2>Table Attribute</h2>
      <table>
        <tbody>
          <tr>
            <th>Attribute</th>
            <th>Name</th>
            <th>Description</th>
          </tr>
          <tr>
            <td><p class="td_first_column">colspan</p></td>
            <td>Column Span</td>
            <td>Defines how many columns a td element should span.</td>
          </tr>
          <tr>
            <td><p class="td_first_column">rowspan</p></td>
            <td>Row Soab</td>
            <td>Defines how many rows a td element should span.</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
  </body>
</html>

## styles.css
* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}

html {
  background-color: #260026;
  color: white;
  height: 100vh;
}

h1 {
  margin-top: 1rem;
}

h1,h2,h3 {
  padding: 0.25rem;
  text-align: center;
}

table,
th,
td {
  border: 1px double rgb(255, 255, 255);
  border-collapse: collapse;
  padding: 0.25rem;
}

body {
  display: flex;
  flex-direction: column;
  align-items: center;
  font-family: monospace;
  height: 100%;
}

.table1, .table2 {
  display: flex;
  flex-direction: column;
  align-items: center;

}

.td_first_column {
  background: purple;
  border-radius: 2px;
  text-align: center;
}

.table1 {
  margin-top: 1rem;
}

.table2 {
  margin-top: 2rem;
}


.table1 h2, .table2 h2 {
  margin-bottom: 1rem;
}
	<html lang="en">
	<head>
	<link href="./styles.css" rel="stylesheet" />
	<meta name="viewport" content="width=device-width, initial-scale=1.0" />
	<title>Cheat Sheet</title>
	</head>
	<header><h1>HTML Table Reference</h1></header>
	<body>
	<div class="tables">
	<div class="table1">
	<h2>Table Tags</h2>
	<table>
	<tbody>
	<tr>
	<th>Tag</th>
	<th>Name</th>
	<th>Description</th>
	</tr>
	<tr>
	<td><p class="td_first_column"><table></p></td>
	<td>Table</td>
	<td>The wrapper element for all HTML tables.</td>
	</tr>
	<tr>
	<td><p class="td_first_column"><thead></p></td>
	<td>Table Head</td>
	<td>The set of rows defining the column headers in a table</td>
	</tr>
	<tr>
	<td><p class="td_first_column"><tbody></p></td>
	<td>Table Body</td>
	<td>The set of rows containing actual table data.</td>
	</tr>
	<tr>
	<td><p class="td_first_column"><tr></p></td>
	<td>Table Row</td>
	<td>The table row container.</td>
	</tr>
	<tr>
	<td><p class="td_first_column"><td></p></td>
	<td>Table Data</td>
	<td>The table row container.</td>
	</tr>
	<tr>
	<td><p class="td_first_column"><tfoot></p></td>
	<td>Table Foot</td>
	<td>The set of rows defining the footer in a table.</td>
	</tr>
	</tbody>
	</table>
	</div>
	<div class="table2">
	<h2>Table Attribute</h2>
	<table>
	<tbody>
	<tr>
	<th>Attribute</th>
	<th>Name</th>
	<th>Description</th>
	</tr>
	<tr>
	<td><p class="td_first_column">colspan</p></td>
	<td>Column Span</td>
	<td>Defines how many columns a td element should span.</td>
	</tr>
	<tr>
	<td><p class="td_first_column">rowspan</p></td>
	<td>Row Soab</td>
	<td>Defines how many rows a td element should span.</td>
	</tr>
	</tbody>
	</table>
	</div>
	</div>
	</body>
	</html>
	* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	}

	html {
	background-color: #260026;
	color: white;
	height: 100vh;
	}

	h1 {
	margin-top: 1rem;
	}

	h1,h2,h3 {
	padding: 0.25rem;
	text-align: center;
	}

	table,
	th,
	td {
	border: 1px double rgb(255, 255, 255);
	border-collapse: collapse;
	padding: 0.25rem;
	}

	body {
	display: flex;
	flex-direction: column;
	align-items: center;
	font-family: monospace;
	height: 100%;
	}

	.table1, .table2 {
	display: flex;
	flex-direction: column;
	align-items: center;

	}

	.td_first_column {
	background: purple;
	border-radius: 2px;
	text-align: center;
	}

	.table1 {
	margin-top: 1rem;
	}

	.table2 {
	margin-top: 2rem;
	}


	.table1 h2, .table2 h2 {
	margin-bottom: 1rem;
	}