Gap werkt niet in Safari: 3 manieren om het gemakkelijk op te lossen

Wie stelt het niet op prijs als browsers nieuwe CSS-functies implementeren? Soms werken bepaalde functies, zoals de kolomopening, echter niet in Safari.

De gap-eigenschap is een poging om een ​​eigenschap te bieden die vergelijkbaar is met het CSS-raster en flexbox. Het is verantwoordelijk voor de ruimte (goten) tussen kolommen en rijen.

Bepaalde browsers, waaronder Safari, schakelen de eigenschap gap echter niet in bij gebruik van de flexibele lay-out. Dit is niet het enige probleem met de browser, en velen meldden dat Safari kan geen bestand downloaden, maar dat probleem hebben we in een aparte handleiding behandeld.

Werkt gap in Safari?

Als de kolomopening of rasteropening niet werkt in Safari, komt dit hoogstwaarschijnlijk doordat u een Safari-versie van minder dan 14 gebruikt.

Row-gap en column-gap worden nu ondersteund in Flexbox-containers in Safari 14.1. Deze update maakt het mogelijk om flexbox te gebruiken in webdesign zonder lastige marge-hacks.

Maar als de kolomopening niet werkt in Safari, zijn er manieren om dit op te lossen.

Wordt Flexbox Gap in alle browsers ondersteund?

De meeste moderne browsers ondersteunen flexbox. Verschillende webbrowsers hebben een experimentele implementatie van flexbox. Het gebruik van een leveranciersvoorvoegsel was de standaardprocedure voor het ontwikkelen van experimentele implementaties.

Dit probleem treft alleen Safari vóór versie 15.4, maar als je deze of een nieuwere release gebruikt, heb je geen problemen.

Nu u meer weet over deze functie, laten we eens kijken wat we kunnen doen als grid-gap niet werkt in Safari.

Snelle tip:

Simpel gezegd, u kunt dit websiteprobleem met gap-kolommen of -rijen oplossen door eenvoudig uw browser naar Opera te schakelen.

Deze tijdelijke oplossing lost het probleem in Safari niet op, maar levert nog steeds geoptimaliseerde navigatie met ondersteuning voor gap-eigenschappen en veel integratiefuncties.

Opera

Navigeer zonder fouten op elke webpagina met behulp van geavanceerde functies en toegankelijkheid.

Vrij Bezoek website

Hoe los ik het gat op als het niet werkt in Safari?

1. Werk uw Safari bij naar de nieuwste versie

1. Selecteer Systeem voorkeuren van de Appel menu in de hoek van uw scherm.
   
2. Klik op Software-update.
   
3. Wacht tot de Mac een updatecontrole uitvoert.
4. Klik Waardeer nu op als er toegankelijke updates zijn.
   
5. Vink de optie aan met het label Mijn Mac automatisch up-to-date houden om automatisch macOS- en Safari-upgrades te krijgen.
6. Wacht tot eventuele updates op je Mac zijn geïnstalleerd.

Deze oplossing is geen oplossing voor Safari flex gap, en het zal het probleem permanent op uw computer oplossen.

2. Tijdelijke oplossing voor flex gap

1. Open uw CSS-bestand.
2. Voeg nu aan het gewenste element de volgende code toe:
weergave: raster;
raster-gap: 8rem;
tussenruimte: 8rem;
   
3. Wijzigingen opslaan.

Als CSS flex gap niet werkt, kunt u dit probleem oplossen door een tijdelijke oplossing te gebruiken. Er is geen ondersteuning voor Flexbox in Safari minder dan 14.

Grid gap wordt ondersteund in eerdere Safari-versies; daarom verdient het de voorkeur om over te schakelen van display flex naar grid.

3. Gebruik de lobotomized uil selector

1. Open het CSS-bestand in uw favoriete editor.
2. Voeg nu deze regel code toe:.parent_div>*+* { marge-links: 8rem;}

   

3. Wijzigingen opslaan.

Er bestaat een ongebruikelijke CSS-selector van drie tekens in de vorm van de lobotomized owl-selector. Omdat het een griezelige gelijkenis vertoont met de leegte blik van een uil, wordt het de lobotomized owl selector genoemd.

Wat kan ik gebruiken in plaats van een gat in CSS?

In plaats van gap in CSS 3 te gebruiken, kun je margin-right gebruiken in CSS 3. Als gap helemaal niet werkt in Safari, kunt u de bovengenoemde oplossingen volgen om dit probleem op te lossen.

Het probleem met de kloof lijkt echter te zijn opgelost in de nieuwere versies van Safari, dus u hoeft geen tijdelijke oplossingen meer te gebruiken.

Als de kloof niet werkt in Safari, is de beste optie om uw browser bij te werken, maar als dat geen optie is, moet u tijdelijke oplossingen gebruiken.

Dit is een probleem aan de clientzijde, maar velen hadden problemen aan de serverzijde, zoals de server reageert niet meer Safari berichten, maar deze kunnen ook worden opgelost.

Is het je gelukt om het gap-probleem in Safari op te lossen? Laat ons weten welke oplossing voor u heeft gewerkt.