https://wiki.rettungsdienstblog.eu/api.php?action=feedcontributions&feedformat=atom&user=AmadoCode6090 2026-11-11T03:49:20Z Benutzerbeiträge MediaWiki 1.37.1 https://wiki.rettungsdienstblog.eu/index.php?title=5_zasad,_dzi%C4%99ki_kt%C3%B3rym_link_trafi_do_pliku_w_innym_folderze&diff=497810 2026-10-19T18:10:36Z

<p>AmadoCode6090: Die Seite wurde neu angelegt: „Kiedy marginesy się zapadają, a kiedy nie Zapadanie zachodzi między dwoma blokami, które są bezpośrednimi sąsiadami w tym samym kontekście formatowania. Dotyczy to także rodzica i pierwszego lub ostatniego dziecka, jeśli rodzic nie ma obramowania, wypełnienia ani odstępu wewnętrznego oddzielającego je od dziecka. Marginesy nie zapadną się, gdy między elementami znajdzie się cokolwiek, co przerwie styk: padding, border, element inline, te…“</p> <hr /> <div>Kiedy marginesy się zapadają, a kiedy nie Zapadanie zachodzi między dwoma blokami, które są bezpośrednimi sąsiadami w tym samym kontekście formatowania. Dotyczy to także rodzica i pierwszego lub ostatniego dziecka, jeśli rodzic nie ma obramowania, wypełnienia ani odstępu wewnętrznego oddzielającego je od dziecka. Marginesy nie zapadną się, gdy między elementami znajdzie się cokolwiek, co przerwie styk: padding, border, element inline, tekst, float albo ustawienie overflow inne niż visible. Wystarczy jedna taka przeszkoda, by oba odstępy zaczęły się sumować.&lt;br&gt;&lt;br&gt;Kolejna opcja to ujemny margines dopasowany do szerokości spacji. To rozwiązanie kruche — wartość zależy od użytego fontu i rozmiaru tekstu, więc przy zmianie kroju pisma odstęp wróci albo elementy zaczną się nachodzić. Jeśli zależy ci na trwałym efekcie, rozważ rezygnację z inline-block na rzecz flexboxa. Kontener z display: flex układa dzieci w rzędzie bez żadnych przerw, a odstępy ustawiasz świadomie przez gap. To obecnie najczystsze podejście i nie wymaga żadnych sztuczek z białymi znakami.&lt;br&gt;&lt;br&gt;Warto najpierw sprawdzić, czy to naprawdę wina białych znaków. Otwórz narzędzia deweloperskie, zaznacz element i obejrzyj jego pole. Jeśli odstęp nie ma koloru marginesu ani paddingu, a mimo to istnieje, sprawa jest jasna. Pomaga też szybki test: ustaw oba elementy dokładnie obok siebie w kodzie, bez żadnego znaku między znacznikami, i odśwież podgląd. Gdy przerwa zniknie, masz potwierdzenie.&lt;br&gt;&lt;br&gt;Praktyczne sposoby radzenia sobie z tym zjawiskiem są trzy. Pierwszy to świadome korzystanie z zapadania i ustawianie tylko jednego marginesu — najczęściej dolnego — między kolejnymi blokami tekstu. Drugi to dodanie cienkiego paddingu lub obramowania, które rozdzieli marginesy, gdy naprawdę potrzebujesz ich sumy. Trzeci to rezygnacja z marginesów na rzecz odstępów zarządzanych przez układ, na przykład flex lub grid z właściwością gap, gdzie zapadanie w ogóle nie występuje.&lt;br&gt;&lt;br&gt;Domyślne zachowanie kontenera flex polega na upychaniu wszystkich elementów w jednej linii. Gdy brakuje miejsca, przeglądarka próbuje je ściskać — zmniejsza ich szerokość, zgniata zawartość, a przy sztywnych wymiarach doprowadza do przepełnienia i poziomego przewijania. Wystarczy dodać do rodzica jedną właściwość, aby zmienić ten mechanizm: flex-wrap: wrap. Od tego momentu elementy, którym nie starczy miejsca w bieżącym rzędzie, przechodzą do kolejnego, zamiast się kurczyć.&lt;br&gt;&lt;br&gt;Format pliku graficznego nie jest kwestią gustu. Zły wybór oznacza albo rozmyte krawędzie tam, gdzie powinny być ostre, albo pliki ważące wielokrotnie więcej, niż to konieczne. Trzy typy obrazów, które najczęściej pojawiają się w internecie i dokumentach — ikona, zdjęcie, prosty wykres — mają odmienne wymagania i rządzą się innymi regułami. Wybór właściwego formatu zaczyna się od jednego pytania: czy obraz składa się z płaskich kolorów i ostrych krawędzi, czy z płynnych przejść tonalnych.&lt;br&gt;&lt;br&gt;W praktyce warto zacząć od display: flex; flex-wrap: wrap; gap: 1rem; i dopiero potem dodawać wymiary dzieciom. Jeśli układ ma się łamać w konkretnym punkcie, lepiej użyć flex-basis z wartością procentową lub jednostką względną niż sztywnej szerokości w pikselach. Dzięki temu elementy same decydują, kiedy przejść do nowego rzędu, a kontener pozostaje odporny na zmianę szerokości okna i dłuższe treści.&lt;br&gt;&lt;br&gt;Ścieżka bezwzględna zaczyna się od korzenia systemu plików albo od litery dysku. W systemach uniksowych to ukośnik na początku, w Windows dodatkowo litera dysku i dwukrodek. Taka ścieżka jest jednoznaczna i zawsze wskazuje to samo miejsce, niezależnie od tego, skąd ją wywołasz. Ścieżka względna nie ma punktu początkowego — liczy się od katalogu, w którym znajduje się plik zawierający link. To właśnie dlatego ten sam zapis raz działa, a raz nie.&lt;br&gt;&lt;br&gt;Najwięcej problemów sprawia zapadanie marginesu rodzica z dzieckiem. Gdy kontener nie ma paddingu ani obramowania, margines górny dziecka „ucieka&quot; na zewnątrz i przesuwa cały blok w dół, zamiast odstępić treść od jego krawędzi. Typowy objaw to tło rodzica, które nie obejmuje dziecka, oraz nieoczekiwany odstęp nad całym układem. Łatwo to przeoczyć, bo wygląda jak błąd wysokości, a jest skutkiem zapadania.&lt;br&gt;&lt;br&gt;Zapadanie marginesów pionowych to zachowanie modelu pudełkowego, w którym sąsiadujące odstępy nie sumują się, lecz nachodzą na siebie. Jeśli nad jednym akapitem ustawisz odstęp dolny 40 pikseli, a pod nim odstęp górny 30 pikseli, wizualnie między nimi pojawi się 40 pikseli, a nie 70. Dzieje się tak, bo przeglądarka wybiera większą z dwóch wartości, a nie ich sumę. Zasada dotyczy wyłącznie kierunku pionowego — marginesy poziome zawsze się dodają i nie znikają.&lt;br&gt;&lt;br&gt;Sprawdzaj, czy problem dotyczy samego rodzica, czy także dzieci. Jeśli dziecko ma display: inline-block albo display: inline, flex i tak potraktuje je jako element flex. Nowa linia w tekście wewnątrz takiego elementu działa normalnie, ale przenoszenie całych bloków do kolejnego wiersza już nie. Kolejna pułapka to białe znaki w HTML — przy flexie nie generują odstępów między elementami, więc nie da się nimi sterować jak przy blokach.</div>

AmadoCode6090 https://wiki.rettungsdienstblog.eu/index.php?title=Benutzer:AmadoCode6090&diff=497809 2026-10-19T18:10:34Z

<p>AmadoCode6090: Die Seite wurde neu angelegt: „Entuzjasta praktycznego designu z wieloletnią praktyką. Piszę o tym, jak łączyć wygodę z ładnym wnętrzem. Najbardziej lubię proste rozwiązania, które da się zrobić samemu.“</p> <hr /> <div>Entuzjasta praktycznego designu z wieloletnią praktyką. Piszę o tym, jak łączyć wygodę z ładnym wnętrzem. Najbardziej lubię proste rozwiązania, które da się zrobić samemu.</div>

AmadoCode6090