הערות עיצוב - בעיות יישור (כנראה)

[uda]

פוסט שלי מופיע ב-chrome מיושר לשמאל וב-FF מיושר לימין (כמו שצריך להיות)

בפיירפוקס

בכרום

וידאתי כבר שלא מדובר בתוספי דפדפן או פרופיל מחובר

עריכה: הבעיה נראית כמו בעיית יישור ולא RTL כפי שחשדתי בהתחלה, ולראיה, הנקודה בסוף משפט נמצאת בשמאל ולא בימין.
מבדיקה שטחית, נראה שהספרה 2 בתחילת הציטוט גרם לשימוש ב-ol ו-li, והבעיה היא למעשה בדפדפן שהוסיף ל-li את הכלל הבא:
text-align: -webkit-match-parent

כלומר, היום והיישור הרגיל מבוסס על RTL ו-LTR, טקסט בעברית מיושר אוטומטית לימין מבלי צורך להגדיר text-align, אבל היות וברירת המחדל בדפדפן הוא left, אז ברגע שמגיעים ל-li שמיישם את הפיצ’ר הזה של כרום הוא מיישר גם טקסט של RTL לשמאל במקום לימין.

בקצרה, כנראה לא באג בפורום אלא בכרום, וצריך לבדוק איך זה נראה באתרים אחרים שלא מכריזים במפורש text-align.

---

ובאותו נושא, גם בפיירפוקס הטקסט הזמני (placeholder) בשדה יצירת הנושא מיושר לשמאל, למרות שמתחיל בתווי עברית:

[uda]

בדקתי קצת יותר לעומק, נראה שיש באג בפירוש של dir=auto, אבל הימנעות משימוש בתכונה הזו יסדר את הנראות של רשימות בכרום.
כדאי להימנע משימוש ב-dir=auto בערכת העיצוב, זה לא מוסיף כי יש כבר הגדרה של direction: rtl ב-html, וזה רק מפעיל באג מוזר…

[isoc-il]

תודה.
העניין הוא של-discourse אין אפשרות בעורך התוכן להוסיף יישור ימין/שמאל או כיוון rtl/lrt. כך ש-auto קורא את הטקסט ומיישר לפיו. ייתכן שכרום לא מפרש את זה כמו שצריך. ייתכן שרואה בספרה 2 סימן לטקסט שאינו עברית.
הנה הקוד הרלוונטי:

api.onToolbarCreate(() => {
Ember.run.later(() => {
$(“textarea.d-editor-input”).attr(“dir”, “auto”);
}, 1000);
});
api.decorateCooked($elem => {
$elem.find("*").attr(“dir”, “auto”);
});

[uda]

אז זהו, ש-“2.” גורם לשימוש ב-ol, שזה בפני עצמו לא מהווה בעיה, בדקתי את זה עם קבצי בדיקות של webkit, וזה קורה בכל שפה ש-li מקבל text-align: -webkit-match-parent, וזה גורם לבעיות כאשר יש dir=auto כי זה מאפס את ה-direction: rtl ואז הכל מתיישר לשמאל.
לכן, מה שצריך זה להוריד את הקוד שמוסיף dir=auto, בדקתי ונראה שזה מסדיר את העניין.

[isoc-il]

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

[uda]

נראה לי שזו בעיה בדפדפנים… אני בודק עוד כדי להכניס דיווח
כאן אני מדגים את ההבדל בין אלמנטים אחרים לאלמנט li שהדפדפן אוטומטית מצמיד לו text-align: match-parent

תודה בינתיים

[uda]

היות והבעיה נעוצה בשימוש ב-text-align ב-stylesheet המובנה של הדפדפן, שימוש בכלל הבא אמור לפתור לנו את התצוגה עד לתיקון הבאג:

li {
    text-align: start;
}

[isoc-il]

תודה יהודה.

Done

1. פריט ברשימה

2. פריט ברשימה

[uda]

הפוסט המקורי עכשיו נראה תקין, אבל הרשימה שלך נראית שוב מוזר בכרום.
בפוסט המקורי הטקסט עצמו נמצא ישירות בתוך ה-li בעוד במקרה כאן הטקסט נמצא בתוך p מה שמשפיע בכלל על ה-dir של ה-li עצמו מה שמוכיח את הטענה שלי שהבעיה של היא בחישוב של dir=auto כאשר האלמנט לא מכיל את הטקסט ישירות.

רשימה רגילה:

• פריט ראשון
• פריט שני

רשימה ממוספרת:

1. פריט ראשון
2. פריט שני