Spacing a awm

Bootstrap hian element pakhat hmel siam danglam theihna tur shorthand responsive margin leh padding utility class hrang hrang a keng tel a.

A hnathawh dan

Element emaw a sir subset emaw hnenah shorthand class hmangin responsive-friendly marginemaw value emaw dah rawh. paddingProperty pakhat zel, property zawng zawng, leh vertical leh horizontal property te support a keng tel bawk. Class te hi default Sass map atanga siam a ni .25rema, 3rem.

Notation hmanga ziah a ni

xsBreakpoint zawng zawng, from to -a hman tur spacing utility te xlhian breakpoint abbreviation an nei lo. Hei hi a chhan chu chu class te chu atanga min-width: 0leh chunglam atanga hman a nih avangin media query-in a phuar lo a ni. Mahse, breakpoint dang zawng zawngah chuan breakpoint abbreviation a awm ve tho.

Class te chu , , , leh atan format hmangin an vuah {property}{sides}-{size}a ni.xs{property}{sides}-{breakpoint}-{size}smmdlgxl

Khawiah nge property chu:

• m- class set te tanmargin
• p- class set te tanpadding

Khawiah nge sides chu pakhat a ni:

• t- class hrang hranga set margin-toporpadding-top
• b- class hrang hranga set margin-bottomorpadding-bottom
• l- class hrang hranga set margin-leftorpadding-left
• r- class hrang hranga set margin-rightorpadding-right
• x- class hrang hrang set te tan *-leftleh*-right
• y- class hrang hrang set te tan *-topleh*-bottom
• blank - element sir 4 zawng zawnga a marginemaw set tu class te tanpadding

Khawiah nge size chu pakhat a ni:

• 0margin- class-te tan chuan or paddingsetting hmanga tihbo0
• 1- (by default) class hrang hrang tan marginor paddingto set te tan$spacer * .25
• 2- (by default) class hrang hrang tan marginor paddingto set te tan$spacer * .5
• 3- (by default) class hrang hrang tan marginor paddingto set te tan$spacer
• 4- (by default) class hrang hrang tan marginor paddingto set te tan$spacer * 1.5
• 5- (by default) class hrang hrang tan marginor paddingto set te tan$spacer * 3
• automargin- to auto set tu class te tan

$spacers( Sass map variable-ah entry dah belhin size tam zawk i dah belh thei bawk .)

Entirna te

Heng class hrang hrangte aiawhtu entirnan thenkhat chu hetiang hi a ni:

.mt-0 {
  margin-top: 0 !important;
}

.ml-1 {
  margin-left: ($spacer * .25) !important;
}

.px-2 {
  padding-left: ($spacer * .5) !important;
  padding-right: ($spacer * .5) !important;
}

.p-3 {
  padding: $spacer !important;
}

Horizontal centering a awm a

Chu bâkah, Bootstrap hian .mx-autofixed-width block level content—chu chu content nei display: blockleh widthset—horizontal margins autochu

<div class="mx-auto" style="width: 200px;">
  Centered element
</div>