wikitable

<!DOCTYPE html>
<head>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!--site title, what you see in your tab-->
 <title>wikitable</title>
<!--change the "wikitable" in "wikitable.css" to what your css file is named-->
 <link href="wikitable.css" rel="stylesheet" type="text/css" media="all">

</head>
<!--wrapper-->
<div class="wrapper">
 <!--header-->
  <header></header>
 <!--main-->
<main id="clear">
 <!--breadcrumb-->
  <p class="breadcrumb">...In <a href="">Templates</a>, <a href="">Code</a> </p>

 <h1 id="flair">Wikitable Code</h1>

 <!--table-->
 <table class="infotable">
<tbody><tr>
<th colspan="2" id="centertext" style="text-align:center">Ixnael
</th></tr>
<tr>
  <th colspan="2" style="text-align: center;"><p><img src="https://f2.toyhou.se/file/f2-toyhou-se/characters/15406341?1673375236" alt="clodsire render"></p>
</th></tr>
<tr>
<td colspan="2" style="text-align: center"><i>description. a transparent image is best, but any works</i>
</td></tr>
<tr>
<th colspan="2" id="centertext">Sociology
</th></tr>
<tr>
</td></tr>
<tr>
<th>Population
</th>
<td>3,012,000,000
</td></tr>
<tr>
<th>Orbital Station
</th>
<td>Coatl
</td></tr>
<tr>
<th colspan="2" id="centertext">Orbital Characteristics
</th></tr>
<tr>
<th>Day
</th>
<td>23 hrs.
</td></tr>
<tr>
<th>Axis Tilt
</th>
<td>1/360th
</td></tr>
<tr>
<th>Size
</th>
<td>4/5ths Terra
</td></tr>
<tr>
<th>Year
</th>
<td>343 days
</td></tr>
<tr>
<th>Atmosphere
</th>
<td>Habitable
</td></tr>
<tr>
<th>Gravity
</th>
<td>9.977 m/s²
</td></tr>
<tr>
<tr>
 <th colspan="2" id="centertext">   Geography and Climate
</th></tr>
<tr>
<th>Dominant Climate
</th>
  <td>
  <!--spoilers, copy here to use elsewhere-->
    <details>
  <!--spoiler header-->
  <summary>SPOILERS</summary>
   <!--begin list of spoilers-->
  <ul><li>tropical</li><li>subtropical</li></ul>
   <!--end list of spoilers-->
  </details>
   <!--end copy-->
</td></tr>
<tr>
<th>Equatorial Temprature
</th>
<td>88F
</td></tr>
<tr>
<th>Polar Temprature
</th>
<td>75F
</td></tr>
<tr>
<th>Superscript
</th>
 <!--the <sup> tag is for superscript-->
<td>Citation<sup>1</sup>
</td></tr>
<tr>
<th>Subscript
</th>
<!--the <sub> tag is for subscript-->
<td>Name<sub>1</sub>
</td></tr>
<tr>
</tbody></table>
  <!--end table-->

 <!--main content-->
 <!--quotebox-->
<div class="quotebox">"mountain dew game fuel"</div>
<!--end quotebox-->
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc velit arcu, viverra ut elit in, dignissim ultricies mi. Praesent faucibus tempus dolor, vitae condimentum arcu feugiat in. Donec ligula lacus, porta eu tempor et, pretium sit amet justo.</p>
<p> Mauris varius a magna at sodales.  <a href="">This is what a link looks like.</a> <b>This is bolded text.</b> <i>This is italic text.</i> <s>And strikethrough. </s> </p>


<!--table of contents-->
<div class="toc">
<details class="contents"><summary class="showcontent">Show Content</summary>
 <ul>
   <li>1. Wikitable Code</li>
  <li>2. Other Features</li>
 <ul><li>2.1 Part of a Series On</li>
   <li>2.1 Flair</li>
 </ul>
</details>
</div>
<!--end table of contents-->
    <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p>

<h3>Other Features</h3>
<p>Here are some fun extras I wanted to include:</p>
<h4>Part of a Series Of...</h4>
<!--series box-->
<details class="reveal">
<summary class="revealsummary">A Series Of People</summary>
  <p><a href="">person</a> • this page • <a href="">person</a> • <a href="">person</a> </p>
  <p>Those list boxes from wiki. To center it for use in the footer, use <code>margin: auto</code> in the CSS.</p>
</details>
<!--end series box-->

<h4>Header Flair</h4>
<p>The top of this page has a header flair that uses <code>id="flair"</code> to place an image or unicode character <code>::before.</code> </p>
<h3>Citations</h3>

<ol>
<li>Superscript can help you have a list of real (or fake!) citations.</li>
</ol>
  </main>
<footer>
 footer
</footer>
</div>