-
Data: 2018-03-01 12:54:26
Temat: Re: CSS, jak działa flex-grow?
Od: Marek S <p...@s...com> szukaj wiadomości tego autora
[ pokaż wszystkie nagłówki ]W dniu 2018-03-01 o 01:01, Borys Pogoreło pisze:
> Ten atrybut musisz rozpatrywać w połączeniu z flex-shrink i flex-basis,
> dopiero wtedy ma sens. W tym przypadku miesza Ci flex-basis, który
> domyślnie ma wartość "auto", więc przeglądarka za szerokość początkową
> bierze szerokość tekstu. A później każesz jej wyrównać proporcjonalnie
> wszystkie elementy, więc dodaje do każdego tę samą ilość pustego miejsca.
>
> Jeśli chcesz mieć wszystkie elementy tej samej *całkowitej* szerokości (nie
> proporcjonalnej do treści), to musisz jeszcze dodać "flex-basis: 0".
>
Dzięki - trochę pomogło. Trochę bo nadal jest coś nie tak jak to bym
sobie wyobrażał.
Rozumiem, że z flex-shrink się pomyliłeś? Bo albo grow albo shrink?
Zrobiłem eksperyment. Dałem za Twoją poradą basis na 0. Rozciągnąłem
layout tak aby komórka po lewej miała 200px szerokości. Wszystkie
komórki z wyjątkiem są teraz równe. Niby świetnie, ale...
ustawiłem dla komórki #2 style="flex-grow: 2". No i niespodzianka.
Wszystkie komórki z wyjątkiem #2 mają nadal po 200px ale 2ga ma...
370px! Pomyślałem: dobra, ekran może za wąski. Rozciągnąłem go więc do
300px na komórkę. No i #2 ma teraz 520px. Na Edge i FF identycznie. Więc
nadal coś jest nie tak.
Zrobiłem też kolejną rzecz: ustawiłem basis na 200px. Dla układu
poziomego oczekiwałbym, że zadziała jak width. Tymczasem chyba nic się
nie nie dzieje. Efekt podobny do wartości 0 i to nawet jeśli ostatnia
komórka ma flex-basis:auto - bo pomyślałem, że jedna z nich musi przejąć
na siebie nadmiar pikseli. Owszem, zmieniła rozmiar ale reszta nie ma po
200px - jest elastyczna.
--
Pozdrawiam,
Marek
Następne wpisy z tego wątku
- 01.03.18 20:38 Borys Pogoreło
- 02.03.18 15:53 Marek S
- 02.03.18 21:26 Borys Pogoreło
- 02.03.18 23:16 Marek S
- 03.03.18 00:14 Borys Pogoreło
- 03.03.18 16:43 Marek S
Najnowsze wątki z tej grupy
- Jakie znacie działające serwery grup dyskusyjnych?
- is it live this group at news.icm.edu.pl
- php, linki z nazwami a $_GET, SEO
- www polityka pl captcha
- dyktatura brudnego palucha
- www.znanylekarz.pl
- Czy pytanie o sczytywanie stron programami/skryptami to tu?
- Grupy webdevowe
- Jak wydrukować stronę?
- IIS, kilka witryn
- linki <a href="/strona.php"> (ze slashami)
- co rozszerza stronę??
- responsywny akapit <p>
- Czy istnieje jakiś emulator przeglądarek pod Mac'a?
- taka sama konfiguracja dla localhost i produkcji
Najnowsze wątki
- 2024-12-12 Warszawa => Administrator Bezpieczeństwa IT <=
- 2024-12-12 Ostrów Wielkopolski => Trener zespołu sprzedaży Call Center <=
- 2024-12-12 Kraków => Key Account Manager <=
- 2024-12-11 SEP 1 kV E
- 2024-12-11 DNS restrictions are on
- 2024-12-11 wielkie bu
- 2024-12-11 Białystok => Inżynier bezpieczeństwa aplikacji <=
- 2024-12-11 Aku LiPo źródło dostaw - ktoś poleci ?
- 2024-12-11 Warszawa => Specjalista Bezpieczeństwa Informacji <=
- 2024-12-11 Wrocław => Application Security Engineer <=
- 2024-12-11 Warszawa => Analyst in the Trade Development department (experience wi
- 2024-12-11 Lublin => Programista Delphi <=
- 2024-12-11 Motodziennik #305 Nowy ELEKTRYK za 350 złotych miesięcznie? Kreatywne kredytowanie problemów
- 2024-12-11 Warszawa => Spedytor Międzynarodowy <=
- 2024-12-11 Katowice => Key Account Manager (ERP) <=