TailwindCSS (v2.x) チートシート

## Container

| クラス名 | ブレイクポイント | プロパティ |
|:---|:---|:---|
|container| (None) | width: 100%;|
|| sm (640px)|	max-width: 640px;|
||md (768px)|	max-width: 768px;|
||lg (1024px)|	max-width: 1024px;|
||xl (1280px)|	max-width: 1280px;|
||2xl (1536px)|	max-width: 1536px;|

<p class="codepen" data-height="199" data-theme-id="light" data-default-tab="html,result" data-user="masahiro111" data-slug-hash="rNMorjQ" style="height: 199px; box-sizing: border-box; display: flex; align-items: center; justify-content: center; border: 2px solid; margin: 1em 0; padding: 1em;" data-pen-title="rNMorjQ">
  <span>See the Pen <a href="https://codepen.io/masahiro111/pen/rNMorjQ">
  rNMorjQ</a> by Masahiro (<a href="https://codepen.io/masahiro111">@masahiro111</a>)
  on <a href="https://codepen.io">CodePen</a>.</span>
</p>
<script async src="https://production-assets.codepen.io/assets/embed/ei.js"></script>

## Box Sizing

| クラス名 | プロパティ |
|:---|:---|
|box-border|	box-sizing: border-box;|
|box-content|	box-sizing: content-box;|

## Display
| クラス名 | プロパティ |
|:---|:---|
|block|display: block;|
|inline-block|display: inline-block;|
|inline|display: inline;|
|flex|display: flex;|
|inline-flex|display: inline-flex;|
|table|display: table;|
|table-caption|display: table-caption;|
|table-cell|display: table-cell;|
|table-column|display: table-column;|
|table-column-group|display: table-column-group;|
|table-footer-group|display: table-footer-group;|
|table-header-group|display: table-header-group;|
|table-row-group|display: table-row-group;|
|table-row|display: table-row;|
|flow-root|display: flow-root;|
|grid|display: grid;|
|inline-grid|display: inline-grid;|
|contents|display: contents;|
|hidden|display: none;|

## Floats

| クラス名 | プロパティ |
|:---|:---|
|float-right|float: right;|
|float-left|float: left;|
|float-none|float: none;|

## Clear

| クラス名 | プロパティ |
|:---|:---|
|clear-left|clear: left;|
|clear-right|clear: right;|
|clear-both|clear: both;|
|clear-none|clear: none;|

## Object Fit

| クラス名 | プロパティ |
|:---|:---|
|object-contain|object-fit: contain;|
|object-cover|object-fit: cover;|
|object-fill|object-fit: fill;|

## Object Position

| クラス名 | プロパティ |
|:---|:---|
|object-bottom|object-position: bottom;|
|object-center|object-position: center;|
|object-left|object-position: left;|
|object-left-bottom|object-position: left bottom;|
|object-left-top|object-position: left top;|
|object-right|object-position: right;|
|object-right-bottom|object-position: right bottom;|
|object-right-top|object-position: right top;|
|object-top|object-position: top;|
|object-none|object-fit: none;|
|object-scale-down|object-fit: scale-down;|

## Overflow

| クラス名 | プロパティ |
|:---|:---|
|overflow-auto|overflow: auto;|
|overflow-hidden|overflow: hidden;|
|overflow-visible|overflow: visible;|
|overflow-scroll|overflow: scroll;|
|overflow-x-auto|overflow-x: auto;|
|overflow-y-auto|overflow-y: auto;|
|overflow-x-hidden|overflow-x: hidden;|
|overflow-y-hidden|overflow-y: hidden;|
|overflow-x-visible|overflow-x: visible;|
|overflow-y-visible|overflow-y: visible;|
|overflow-x-scroll|overflow-x: scroll;|
|overflow-y-scroll|overflow-y: scroll;|

## Overscroll Behavior

| クラス名 | プロパティ |
|:---|:---|
|overscroll-auto|overscroll-behavior: auto;|
|overscroll-contain|overscroll-behavior: contain;|
|overscroll-none|overscroll-behavior: none;|
|overscroll-y-auto|overscroll-behavior-y: auto;|
|overscroll-y-contain|overscroll-behavior-y: contain;|
|overscroll-y-none|overscroll-behavior-y: none;|
|overscroll-x-auto|overscroll-behavior-x: auto;|
|overscroll-x-contain|overscroll-behavior-x: contain;|
|overscroll-x-none|overscroll-behavior-x: none;|

## Position

| クラス名 | プロパティ |
|:---|:---|
|static|position: static;|
|fixed|position: fixed;|
|absolute|position: absolute;|
|relative|position: relative;|
|sticky|position: sticky;|

...追記中