Padding and Margin ↔️

In this page, you will learn about padding and margin rules in TenoxUI. There's a few common rules to set the padding and margin.

Type Rules

Padding

Padding Rules

p- : Set padding to the element

pt- : Set padding-top

pb- : Set padding-bottom

pr- : Set padding-right

pl- : Set padding-left

py- : Set padding-top and padding-bottom

px- : Set padding-right and padding-right

Margin

Margin Rules

m- : Set margin to the element

mt- : Set margin-top

mb- : Set margin-bottom

mr- : Set margin-right

ml- : Set margin-left

my- : Set margin-top and margin-bottom

mx- : Set margin-right and margin-right

Example

<div class="mt-24px p-10px">
  <div class="m-0.8em"></div>
</div>

note

There's no default value for all element. You must define it by yourself. All CSS units are supported.