Offsetowanie kolumn nie działa (Bootstrap v4.0.0-beta)

Używam Boostrap 4 (Bootstrap v4.0.0-beta) Beta i napotyka problemy z kolumnami z kompensacją. Wcześniej używałam offset-md- * i to działało, z BS4 Beta to jest usuwane zgodnie z dokumentami. Nowa metoda wymieniona w dokumentach używa .ml-auto, gdy próbuję użyć jej z col-md-4, to przeskakuje 4 kolumny. Czego chcę jest zwyczaj potrącenie jakOffsetowanie kolumn nie działa (Bootstrap v4.0.0-beta)

**<div class="col-md-4 offset-md-2"></div>**

Próbowałem za pomocą

**<div class="col-md-4 ml-md-2"></div>**

ale nie działa Czy to jest bug czy istnieje inny sposób to zrobić?

Oto oficjalne dokumenty o potrącenie https://getbootstrap.com/docs/4.0/layout/grid/#offsetting-columns

Źródło

2017-08-12 Prashant Sharma

Dlaczego używasz 'ml'? –

Bootstrap 4 offset klas zostały usunięte w wersji beta 1, ale zostanie przywrócony w Beta 2

Nowy auto-margin replacements for offset ruszy kolumnę na tyle, ile to możliwe. To zależy od tego, ile chcesz "przesunąć" kolumnę w prawo. Jeśli nie są one żadnymi innymi kolumnami po prawej stronie col-md-4, przejdą one całą drogę do prawej strony row. Zasadniczo offset było istotne dla pływających kolumn, ale nie jest już istotne, ponieważ Bootstrap 4 to flexbox.

Jeśli chcesz przenieść col-md-4 ponad tylko 2 jednostki kolumn, najlepszym sposobem byłoby wykorzystanie kolumny manekin/zastępczy ...

<div class="row"> 
     <div class="col-md-2"></div> 
     <div class="col-md-4"> 
      .. 
     </div> 
</div>

https://www.codeply.com/go/SqrQIOAY7

Jeśli istnieją inne col-md-4 na prawo od pierwszego, a następnie ml-auto i mr-auto zadziałają na w środku obu kolumn ...

<div class="row"> 
     <div class="col-md-4 ml-auto"> 
      . 
     </div> 
     <div class="col-md-4 mr-auto"> 
      . 
     </div> 
</div>

https://www.codeply.com/go/SqrQIOAY7n

Jeśli chcesz wyśrodkować col-md-4 następnie wystarczy użyć mx-auto do stworzyć równe marginesy po obu stronach.

Uwaga: specyficzny kolumna offsets will be restored as of Beta 2

Źródło

2017-08-12 17:09:49 ZimSystem

Dzięki, ale to puste div z col-md-2 wygląda jak "Hack" no ?, to jest to, czego użyłem przed opublikowaniem tego pytania. Użyję twojego drugiego rozwiązania, ponieważ mam kolejny col-md-4 po prawej, dam ci znać, jeśli to rozwiąże mój problem. –

Może wydawać się hackerem, ale jest to jedyne rozwiązanie, w którym przesunięcia zostały zastąpione przez automatyczne marginesy. – ZimSystem

Bardzo dziękuję za twoją napiwek, twoje drugie rozwiązanie zadziałało i myślę, że na jakiś czas użyję pustego div w innych miejscach, dopóki Bootstrap nie dostanie czegoś nowego do wyrównania. –

ml-md-auto zestawy margin-left: auto; na rozmiar md i powyżej.

Nie można ustawić tego na coś w rodzaju 2.

Należy wykonać: ml-md-auto.

Źródło

2017-08-12 13:47:50

Zobacz [docs] (http://v4-alpha.getbootstrap.com/layout/grid/#offsetting-columns) –

Używam Bootstrap v4 Beta, podałeś link do dokumentu wersji Alpha. Zaktualizowano moje pytanie za pomocą linku do dokumentów. –

Oliver, gdy próbuję użyć ml-md-auto, przeskakuje 4 kolumny, a ja chcę przeskalować 2 kolumny, ale mając col-md-4 –

Zmiana

offset-md-2

do:

col-md-offset-2

pracował dla mnie

Źródło

2018-01-02 22:09:18 clamchoda

Offsetowanie kolumn nie działa (Bootstrap v4.0.0-beta)

Odpowiedz

Powiązane problemy