Grid dziwny błąd grid-template-columns

pytanie zadane 17 sierpnia 2017 w HTML i CSS przez jankowa1ski Gaduła (3,560 p.)

Miałem taki problem (ktory rozwiazalem) ale nie wiem dlaczego własciwie wystąpił. Konkretnie:

Miałem div z display grid i

grid-template-columns: repeat(7,1fr); i to działało w firefoxie ale juz w chromie i chromie mobilny nie

potem zmieniłem więc na wartosc % a nie fr

grid-template-columns: repeat(7,14%); i to juz działa

co prawda dalej nie działa w ms edge mimo ze dałem prefixy? Ktoś wie dlaczego był taki problem? Chrome wspiera grid system a był zaktualizowany.

2 odpowiedzi

odpowiedź 17 sierpnia 2017 przez niezalogowany
wybrane 17 sierpnia 2017 przez jankowa1ski

Najlepsza

Grid to jeszcze nowa technologia (od marca/kwietnia) i bugi związane z gridem nadal nie są największym priorytetem.

Generalnie grid-template-* w chromie (ogólnie przeglądarki bazujące na chromium) nie działa poprawnie od 3-4 wersji. Albo auto albo fr ostro ścina FPS'y albo w ogóle nie działa jak powinno. Osobiście napisałem ticketa do chromium i możesz patrzeć na status: https://bugs.chromium.org/p/chromium/issues/detail?id=726747

Co do Edga to ciężko powiedzieć, bo całkowity support będzie dopiero od 16 wersji. http://caniuse.com/#feat=css-grid

Ewentualnie możesz użyć viewporty zamiast % ale to też nie to samo co auto czy fr.

Ogólnie nie potrzebujesz grida jeżeli nie jest to typowa galeria albo układ strony (patrząc po przykładzie repeat(7, x)). Zawsze możesz poprzestać na flexboxsie i lecieć z justify-content: space-evenly/space-around/space-between.

komentarz 17 sierpnia 2017 przez ForeverFriendzone Dyskutant (7,520 p.)

Nawet bardzo nie dawno włączyli grida, bo w mojej książce (wydanej nie tak dawno) pisze, że ,,funkcja zaimplementowana, ale domyślnie wyłączona". Ale z pewnością niesie za sobą ogromne możliwości :D

komentarz 17 sierpnia 2017 przez niezalogowany

Domyślnie wyłączona była w wersji 55? albo 56, gdzie trzeba było wchodzić na chrome://flags żeby włączyć "eksperymentalną" funkcję.

Od początku marca jest ona domyślnie włączona, a od kwietnia (maja w sumie, bo edge dodał grida pod koniec kwietnia) wszystkie przeglądarki supportują grida.

I tak, daje dużo więcej możliwości od dotychczas standardowego 12-kolumnowego grida

https://gridbyexample.com/examples/

odpowiedź 17 sierpnia 2017 przez ForeverFriendzone Dyskutant (7,520 p.)

W Chrome z gridem jest trochę dziwnie z tego co sam zdążyłem przekonać się na własnej skórze - np. nie wiem czy też tak masz ale nie jestem w stanie wyśrodkować w gridzie divów :(

Co do twojego problemu rzeczywiście Chrome też robi coś dziwnego z fr. To jest ogólnie nowy sprzęt w tej przeglądarce i myślę, że muszą jeszcze nad nim popracować...