פער לא עובד בספארי: 3 דרכים לתקן אותו בקלות

מי לא מעריך את זה כשדפדפנים מיישמים תכונות CSS חדשות? עם זאת, לפעמים תכונות מסוימות, כגון פער העמודות, אינן פועלות בספארי.

מאפיין הפער הוא מאמץ לספק מאפיין דומה לרשת ה-CSS וה-flexbox. הוא יהיה אחראי על הרווח (המרזבים) בין העמודות והשורות.

עם זאת, דפדפנים מסוימים, כולל Safari, אינם מפעילים את מאפיין הפער בעת שימוש בפריסה הגמישה. זו לא הבעיה היחידה בדפדפן, ורבים דיווחו על כך Safari לא יכול להוריד קובץ, אבל כיסינו את הבעיה במדריך נפרד.

האם הפער עובד בספארי?

אם פער העמודות או פער הרשת אינם פועלים ב-Safari, סביר להניח שהסיבה לכך היא שאתה משתמש בגרסת ספארי פחות מ-14.

Row-gap ו-עמודה-gap נתמכים כעת במכולות Flexbox ב-Safari 14.1. עדכון זה מאפשר שימוש ב-flexbox בעיצוב אתרים ללא צורך בפריצות שוליים מביכות.

אבל אם פער העמודות לא עובד בספארי, יש דרכים לתקן את זה.

האם Flexbox Gap נתמך בכל הדפדפנים?

רוב הדפדפנים המודרניים תומכים ב-flexbox. למספר דפדפני אינטרנט יש יישום ניסיוני של flexbox. שימוש בקידומת ספק היה ההליך הסטנדרטי לפיתוח יישומים ניסיוניים.

בעיה זו משפיעה רק על Safari לפני גרסה 15.4, אך אם אתה משתמש במהדורה זו או בכל מהדורה חדשה יותר, אין לך בעיות.

עכשיו כשאתה יודע יותר על תכונה זו, בוא נראה מה אנחנו יכולים לעשות אם grid-gap לא עובד בספארי.

טיפ מהיר:

במילים פשוטות, אתה יכול לפתור בעיה זו באתר עם עמודות או שורות פערים על ידי העברת הדפדפן שלך לאופרה.

פתרון זה אינו פותר את הבעיה ב-Safari, אך עדיין מספק ניווט אופטימלי עם תמיכה במאפייני פער והרבה תכונות אינטגרציה.

אוֹפֵּרָה

נווט ללא שגיאות בכל דף אינטרנט באמצעות תכונות מתקדמות ונגישות.

חינם בקר באתר

איך אני מתקן את הפער אם זה לא עובד בספארי?

1. עדכן את הספארי שלך לגרסה העדכנית ביותר

1. בחר העדפות מערכת מ ה תפוח עץ תפריט בפינת המסך.
   
2. לחץ על עדכון תוכנה.
   
3. המתן עד שה-Mac יבצע בדיקת עדכונים.
4. נְקִישָׁה שדרג עכשיו אם יש עדכונים נגישים.
   
5. סמן את האפשרות המסומנת שמור את ה-Mac שלי מעודכן באופן אוטומטי כדי לקבל שדרוגי macOS ו-Safari באופן אוטומטי.
6. המתן להתקנה של עדכונים ב-Mac שלך.

פתרון זה אינו פתרון לעקיפה של Safari flex gap, והוא יפתור לצמיתות את הבעיה במחשב שלך.

2. פתרון עקיפת הפערים להגמיש

1. פתח את קובץ ה-CSS שלך.
2. כעת הוסף לרכיב הרצוי את הקוד הבא:
תצוגה: רשת;
רשת-פער: 8rem;
פער: 8rem;
   
3. שמור שינויים.

אם פער הגמישות ב-CSS לא עובד, אתה יכול לתקן בעיה זו באמצעות פתרון עוקף. אין תמיכה ב-Flexbox ב-Safari פחות מ-14.

פער רשת נתמך בגרסאות קודמות של Safari; לכן, מעבר מ-display flex לרשת יהיה עדיף.

3. השתמש בבורר הינשוף שעבר לובוטום

1. פתח את קובץ ה-CSS בעורך המועדף עליך.
2. כעת הוסף את שורת הקוד הזו:.parent_div>*+* { margin-left: 8rem;}

   

3. שמור שינויים.

בורר CSS יוצא דופן בן שלושה תווים קיים בצורה של בורר ינשוף לובוטומי. מכיוון שהוא נושא דמיון מוזר למראה הריק של ינשוף, הוא נקרא בורר ינשוף לובוטומי.

במה אוכל להשתמש במקום פער ב-CSS?

במקום להשתמש ב-gap ב-CSS 3, אתה יכול להשתמש ב-marginal-right ב-CSS 3. אם הפער לא עובד בכלל בספארי, אתה יכול לעקוב אחר הפתרונות שהוזכרו לעיל כדי לתקן בעיה זו.

עם זאת, נראה כי בעיית הפערים תוקנה בגרסאות החדשות יותר של ספארי, כך שלא תצטרך לנקוט עוד דרכים לעקיפת הבעיה.

אם הפער לא עובד בספארי, האפשרות הטובה ביותר תהיה לעדכן את הדפדפן שלך, אבל אם זו לא אופציה, תצטרך לפנות לפתרונות מעקפים.

זוהי בעיה בצד הלקוח, אך לרבים היו בעיות בצד השרת, כגון השרת הפסיק להגיב Safari הודעות, אך ניתן לתקן גם אותן.

האם הצלחת לתקן את בעיית הפערים בספארי? ספר לנו איזה פתרון עבד עבורך.