Gap nefunguje v Safari: 3 způsoby, jak to snadno opravit

Kdo by neocenil, když prohlížeče implementují nové funkce CSS? Někdy však některé funkce, jako je mezera mezi sloupci, v Safari nefungují.

Vlastnost gap je snaha poskytnout vlastnost podobnou mřížce CSS a flexboxu. Bude mít na starosti prostor (žlaby) mezi sloupci a řadami.

Některé prohlížeče, včetně Safari, však nepovolují vlastnost gap při použití flexibilního rozvržení. Toto není jediný problém s prohlížečem a mnozí to uvedli Safari nemůže stáhnout soubor, ale tomuto problému jsme se věnovali v samostatné příručce.

Funguje mezera v Safari?

Pokud mezera mezi sloupci nebo mřížkou v Safari nefunguje, je to pravděpodobně proto, že používáte verzi Safari nižší než 14.

Row-gap a column-gap jsou nyní podporovány v kontejnerech Flexbox v Safari 14.1. Tato aktualizace umožňuje použití flexboxu ve webovém designu bez nutnosti nepříjemného hackování okrajů.

Pokud ale mezera mezi sloupci v Safari nefunguje, existují způsoby, jak to opravit.

Je Flexbox Gap podporován ve všech prohlížečích?

Většina moderních prohlížečů podporuje flexbox. Několik webových prohlížečů má experimentální implementaci flexboxu. Použití předpony dodavatele bylo standardním postupem pro vývoj experimentálních implementací.

Tento problém se týká pouze Safari před verzí 15.4, ale pokud používáte toto nebo jakékoli novější vydání, nemáte žádné problémy.

Nyní, když víte více o této funkci, pojďme se podívat, co můžeme dělat, pokud grid-gap v Safari nefunguje.

Rychlý tip:

Jednoduše řečeno, tento problém s webovými stránkami s mezerami ve sloupcích nebo řádcích můžete vyřešit jednoduchým přepnutím prohlížeče na Operu.

Toto řešení nevyřeší problém v Safari, ale stále poskytuje optimalizovanou navigaci s podporou vlastností mezer a spoustou integračních funkcí.

Opera

Navigujte bez chyb na jakékoli webové stránce pomocí pokročilých funkcí a usnadnění.

Volný, uvolnit Navštivte webové stránky

Jak opravím mezeru, pokud nefunguje v Safari?

1. Aktualizujte si Safari na nejnovější verzi

1. Vybrat Systémové preference z Jablko nabídky v rohu obrazovky.
   
2. Klikněte na Aktualizace softwaru.
   
3. Počkejte, až Mac provede kontrolu aktualizací.
4. Klikněte Vylepšit nyní pokud existují nějaké dostupné aktualizace.
   
5. Zkontrolujte možnost označenou Automaticky udržovat můj Mac aktualizovaný pro automatické získávání upgradů macOS a Safari.
6. Počkejte, až se na vašem Macu nainstalují všechny aktualizace.

Toto řešení není řešením Safari flex gap a problém na vašem počítači trvale vyřeší.

2. Řešení mezery Flex

1. Otevřete soubor CSS.
2. Nyní přidejte k požadovanému prvku následující kód:
displej: mřížka;
mřížka-gap: 8rem;
mezera: 8rem;
   
3. Uložit změny.

Pokud flex mezera CSS nefunguje, můžete tento problém vyřešit pomocí řešení. V Safari méně než 14 není podpora pro Flexbox.

Grid gap je podporován v předchozích verzích Safari; proto by bylo vhodnější přepnout z flexibilního zobrazení na mřížku.

3. Použijte lobotomizovaný selektor sov

1. Otevřete soubor CSS ve svém oblíbeném editoru.
2. Nyní přidejte tento řádek kódu:.parent_div>*+* { margin-left: 8rem;}

   

3. Uložit změny.

Neobvyklý tříznakový selektor CSS existuje v podobě lobotomizovaného selektoru sovy. Protože se neuvěřitelně podobá prázdnému vzhledu sovy, nazývá se lobotomizovaný selektor sovy.

Co mohu použít místo mezery v CSS?

Místo použití mezery v CSS 3 můžete použít margin-right v CSS 3. Pokud mezera v Safari vůbec nefunguje, můžete tento problém vyřešit pomocí výše uvedených řešení.

Zdá se však, že problém s mezerou je v novějších verzích Safari opraven, takže se již nebudete muset uchýlit k náhradním řešením.

Pokud mezera v Safari nefunguje, nejlepší možností by bylo aktualizovat prohlížeč, ale pokud to není možné, budete se muset uchýlit k řešení.

Toto je problém na straně klienta, ale mnoho z nich mělo problémy na straně serveru, jako je např server přestal reagovat Safari zprávy, ale i ty lze opravit.

Podařilo se vám vyřešit problém s mezerou v Safari? Dejte nám vědět, které řešení se vám osvědčilo.