Avanoa

O le Bootstrap e aofia ai le tele o vaega fa'apipi'i tali ma vasega fa'aoga e fa'aleleia ai foliga o se elemene.

E faapefea ona galue

Tofi tali-faauo marginpo o paddingtulaga faatauaina i se elemene po o se vaega itiiti o ona itu ma vasega pupuu. E aofia ai le lagolago mo meatotino ta'itasi, meatotino uma, ma mea tu'usa'o ma fa'ata'atia. O vasega e fausia mai se fa'afanua fa'aletonu Sass e amata mai .25remi le 3rem.

Notation

Fa'aoga avanoa e fa'aoga i vaega ta'oto uma, mai xsi le xl, e leai se fa'apu'upu'u va'aiga i totonu. E mafua ona o na vasega o loʻo faʻaoga mai min-width: 0ma luga, ma o lea e le o noatia i se fesili a le aufaasālalau. Ae peitai, o vaega o totoe, e aofia ai se faapuupuuga.

O vasega ua faaigoaina e faaaoga ai le faatulagaga {property}{sides}-{size}mo xsma {property}{sides}-{breakpoint}-{size}mo sm, md, lg, ma xl.

Afai o meatotino o se tasi o:

m- mo vasega ua setiinamargin
p- mo vasega ua setiinapadding

O fea itu o se tasi o:

t- mo vasega e seti margin-toppepadding-top
b- mo vasega e seti margin-bottompepadding-bottom
l- mo vasega e seti margin-leftpepadding-left
r- mo vasega e seti margin-rightpepadding-right
x- mo vasega e seti uma *-leftma*-right
y- mo vasega e seti uma *-topma*-bottom
avanoa - mo vasega e seti se marginpo'o paddingluga uma 4 itu o le elemene

Ole tele ole tasi ole:

0- mo vasega e aveese le marginpo paddingo le setiina i0
1- (e ala i le faaletonu) mo vasega e setiina le marginpo paddingo le$spacer * .25
2- (e ala i le faaletonu) mo vasega e setiina le marginpo paddingo le$spacer * .5
3- (e ala i le faaletonu) mo vasega e setiina le marginpo paddingo le$spacer
4- (e ala i le faaletonu) mo vasega e setiina le marginpo paddingo le$spacer * 1.5
5- (e ala i le faaletonu) mo vasega e setiina le marginpo paddingo le$spacer * 3
auto- mo vasega e setiina le margini le auto

(E mafai ona e faʻaopoopoina le tele o lapopoa e ala i le faʻaopoopoina o faʻamaumauga i le $spacersfesuiaiga o faʻafanua Sass.)

Faataitaiga

O nisi nei o fa'ata'ita'iga fa'atusa o nei vasega:

.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;
}

Tutotonuga faalava

E le gata i lea, o le Bootstrap e aofia ai foi ma se .mx-autovasega mo le fa'ata'atiagatonugatonu-lautele poloka tulaga anotusi—o lona uiga, mea o lo'o i ai display: blockma se widthseti-e ala i le setiina o laina fa'alava ile auto.

Elemene ogatotonu

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