Tables

Default

Decimal Hexadecimal Binary Roman Numeral
1 1 1 I
5 5 101 V
10 A 1010 X
15 F 1111 XV

Compact

Monster Home Likes Cookies Fun to Play With
Wolfman Nondisclosed countryside Sometimes Not really
Mothra Tropical island No Only if you have a flashlight
Oscar the Grouch Sesame Street No No
Cookie Monster Sesame Street Definitely yes Only if you have no cookies

Compact no border

Monster Home Likes Cookies Fun to Play With
Wolfman Nondisclosed countryside Sometimes Not really
Mothra Tropical island No Only if you have a flashlight
Oscar the Grouch Sesame Street No No
Cookie Monster Sesame Street Definitely yes Only if you have no cookies

Left Cells

Wizard Allegiance Triwizard Champion? Can Cast Fireball
Harry Gryffindor Yes No
Gandalf Hobbits Maybe? I don't think so...
Obi-Wan Kenobi Republic/Rebellion No No
Merlin King Arthur Probably invented the tournament Solid maybe

Multiline

Name A/B Comment
Beetlejuice B Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
Mytzlplk A Excepteur sint occaecat cupidatat non proident.
Q A Ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

No border

Monster Home Likes Cookies Fun to Play With
Wolfman Nondisclosed countryside Sometimes Not really
Mothra Tropical island No Only if you have a flashlight
Oscar the Grouch Sesame Street No No
Cookie Monster Sesame Street Definitely yes Only if you have no cookies

Vertical

Basic table .table The classname used to apply general styling of Clarity tables to an HTML table.
Left-aligned table cells .left Use this classname on a td to align its contents to the left edge of the table data cell.
This is not necessary for vertical tables.
Tables without borders .table-noborder This classname will remove borders between table rows as well as the border around the edge of the table.
Also removes the background so that the table will be transparent over the background its container has.
Compact tables .table-compact This classname changes is the height of the table rows from 36px to 24px.
Vertical tables .table-vertical This classname removes the table header and applies table header styles to the left-most column.

Vertical no border and compact

Basic table .table The classname for applying general styling of Clarity tables to an HTML table.
Left-aligned table cells .left This classname on a td aligns content to the left edge of the table cell.
This is not necessary for vertical tables.
Tables without borders .table-noborder This classname removes borders between table rows and the border around the table.
It also removes the background so that the table is transparent over its container background.
Compact tables .table-compact This classname changes the height of the table rows from 36px to 24px.
Vertical tables .table-vertical This classname removes the table header and applies table header styles to the left-most column.

Widths

Language Foo Bar Baz
Pig Latin Oofay Arbay Azbay
Bizarro Bar Foo Bang
Hodor Hodor Hodor Hodor
Color R G B
Black 0 0 0
New Black 255 165 0
Pantone 292 98 168 229
Name Weakness
Frankenstein Fire
Dracula Garlic
Wolfman Squirrels