Table Documentation

This page is on the best way to use the WikiTables that have been created to standardise the look and feel of the wiki. You can directly view the CSS by going to the MediaWiki:Common.css page. The style of the tables has been directly inspired by the LoA wiki and much of the code was adapted from over there.

**Important**: You **can** override any of these by using standard Wikitext and defining the style you want for a particular cell.

## CSS class=sim-table

	+ Sets the table width to 90% of screen size.
	+ Centers the table within it's container.
	+ Sets a 1 pixel black border around every cell (headers included).
	+ Sets a 2 pixel padding between the text in a cell and the border.
	+ If present, captions are **bold** and centered over the top of the table.
* Header Settings (generally the column header):
	+ Sets the background to a Dark Blue #2a5085 to match the Wiki Theme.
	+ Sets the font to **bold** and white #ffffff.
	+ Centers the header in the cell.
	+ (Only when a column header) Forces the text to the bottom of the cell.
* Row Header Settings:
	+ Sets the background to medium blue #D7EDFF to match the Wiki Theme.
	+ Sets the text in the middle of the cell.
	+ Makes the font **bold** and black #000000.
* General Cell Settings:
	+ Sets the background color to an off-white #fafafa for the cells.
	+ Text is centered vertically and horizontally in the cell.

#### WikiText:

```
{| class="sim-table"
! scope="col" | Rows
! scope="col" | Column 1
! scope="col" | Column 2
```

### Basic Table with a Caption and Row Headers

For this one, there is a caption and the first cell in each row is a "Row Header".

#### WikiText:

```
{| class="sim-table"
! scope="col" | Rows
! scope="col" | Column 1
! scope="col" | Column 2
! scope="row" | Row 1
! scope="row" | Row 2
```

#### Result:

This is a Captioned Table
 Row 2

**Important**: Column headers are not particularly picky about whether you designate that they have col scope, you will need to ensure you scope row headers properly otherwise you'll get something like this instead:

This is a table that didn't scope it's row headers!!
 Row 2

## Additional "sim-table" Variants

While the standard format of the table works well for large tables, smaller ones may actually be harder to read this way. So there are additional CSS classes to create a centered table which fits it's contents, and two more to float tables to the right or left of other text present on the page.

### Centered

This is the same as the example above but with the "sim-center" qualifier added.

#### WikiText

```
{| class="sim-table sim-center"
! scope="col" | Rows
! scope="col" | Column 1
! scope="col" | Column 2
! scope="row" | Row 1
! scope="row" | Row 2
```

#### Result:

This is a Centered Table
 Row 2

### Float Left/Right

There are floating options as well. In this example there is the same small table, but it will float to the left/right allowing the text to flow around it.

#### WikiText (change to sim-right to float right):

```
{| class="sim-table sim-left"
! scope="col" | Rows
! scope="col" | Column 1
! scope="col" | Column 2
! scope="row" | Row 1
! scope="row" | Row 2
```

#### Result:

This Table Floats Left
 Row 2

This text is completely meaningless, well apart from the fact that's written in English and the words generally have meaning...it only serves as an example of how text flows and/or doesn't flow around the example table. It's hard to believe you're still reading this. I might as well add some more thanks to the LOA wiki for inspiring the creation of these tables/this document. Awesome stuff.

This Table Floats Right
 Row 2

That's the best information in this entire paragraph. Nothing else but filler words designed to put enough text. But since you're still reading, I guess I have to say thanks for reading, hope you had fun. Please continue to see the rest on how Academia: School Simulator tables work.

## Sorting and Collapsing

In addition to the formats, the tables will still accept the Wikia and MediaWiki CSS class designations. So, if you want to make tables sortable or collapsible you still can!

### Sortable List

To make a list sortable, you just have to specify the class "sortable".

#### WikiText:

```
{| class="sim-table sortable"
! scope="col" | Numbers
! scope="col" | Letters
! scope="col" | Text
```

#### Result:

This is a Sortable Table
 2

### Collapsible

You can make them collapse as well, if there is a lot of information you might not want constantly present (like a long list).

#### WikiText:

```
{| class="sim-table mw-collapsible"
! scope="col" | Numbers
! scope="col" | Letters
! scope="col" | Text
```

#### Result:

This is a Collapsible Table
 2

## Table without Internal Boarders

Tables can be created without internal boarders to organize information differently. Use a basic table and add an ID to the cell you want styled that way. You can achieve some pretty creative results by experimenting with where you put the labels, feel free to experiment.

#### WikiText:

```
{| class="sim-table sim-center"
! scope="col" | Left
! scope="col" | Middle
! scope="col" | Right
! scope="row" | Top
! scope="row" | Middle
! scope="row" | Bottom
```

#### Result:

 Middle
 Bottom

## More Table Information

Take a moment to look around you and see your nearest source of table information here, here and I don't have a third one:

* Fandom Wiki Help: Tables
* MediaWiki Help: Tables