mirror of
https://github.com/tailwindlabs/tailwindcss.git
synced 2025-12-08 21:36:08 +00:00
Use class table for float docs
This commit is contained in:
parent
2b28e89533
commit
91fc6d75c2
@ -11,42 +11,27 @@ features:
|
||||
|
||||
@include('_partials.work-in-progress')
|
||||
|
||||
<div class="border-t border-grey-lighter">
|
||||
<table class="w-full text-left table-collapse">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="text-sm font-semibold text-grey-darker p-2 bg-grey-lightest">Class</th>
|
||||
<th class="text-sm font-semibold text-grey-darker p-2 bg-grey-lightest">Properties</th>
|
||||
<th class="text-sm font-semibold text-grey-darker p-2 bg-grey-lightest">Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody class="align-baseline">
|
||||
<tr>
|
||||
<td class="p-2 border-t border-smoke font-mono text-xs text-purple-dark whitespace-no-wrap">.float-right</td>
|
||||
<td class="p-2 border-t border-smoke font-mono text-xs text-blue-dark whitespace-no-wrap">float: right;</td>
|
||||
<td class="p-2 border-t border-smoke text-sm text-grey-darker">Moves the element to the right side of its container.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="p-2 border-t border-smoke-light font-mono text-xs text-purple-dark whitespace-no-wrap">.float-left</td>
|
||||
<td class="p-2 border-t border-smoke-light font-mono text-xs text-blue-dark whitespace-no-wrap">float: left;</td>
|
||||
<td class="p-2 border-t border-smoke-light text-sm text-grey-darker">Moves the element to the left side of its container.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="p-2 border-t border-smoke-light font-mono text-xs text-purple-dark whitespace-no-wrap">.float-none</td>
|
||||
<td class="p-2 border-t border-smoke-light font-mono text-xs text-blue-dark whitespace-no-wrap">float: none;</td>
|
||||
<td class="p-2 border-t border-smoke-light text-sm text-grey-darker">Removes any previously defined float value.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td class="p-2 border-t border-smoke-light font-mono text-xs text-purple-dark whitespace-no-wrap">.clearfix</td>
|
||||
<td class="p-2 border-t border-smoke-light font-mono text-xs text-blue-dark whitespace-no-wrap">
|
||||
&:after {<br>
|
||||
content: "";<br>
|
||||
display: table;<br>
|
||||
clear: both;<br>
|
||||
}
|
||||
</td>
|
||||
<td class="p-2 border-t border-smoke-light text-sm text-grey-darker">Clear any floats within an element.</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
@include('_partials.class-table', [
|
||||
'rows' => [
|
||||
[
|
||||
'.float-right',
|
||||
'float: right;',
|
||||
"Moves the element to the right side of its container.",
|
||||
],
|
||||
[
|
||||
'.float-left',
|
||||
'float: left;',
|
||||
"Moves the element to the left side of its container.",
|
||||
],
|
||||
[
|
||||
'.float-none',
|
||||
'float: none;',
|
||||
"Removes any previously defined float value.",
|
||||
],
|
||||
[
|
||||
'.clearfix',
|
||||
"&::after {\n content: \"\";\n display: table;\n clear: both;\n}",
|
||||
"Clear any floats within an element.",
|
||||
],
|
||||
]
|
||||
])
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user