זה לא רטורי: אני באמת מעוניין למצוא מקרי שימוש נהדרים עבור פריסות מרובות עמודות CSS.
התשובה נראית פשוטה. השתמש בעמודות כאשר אתה רוצה לפצל כל תוכן לעמודות, נכון? הנה בדרך כלל סוג הדוגמאות שתמצא במאמרים שמראים כיצד פועלות פריסות של עמודות CSS, כולל פריסות משלנו אלמנך:
ממש על. אבל האם זהו מקרה שימוש בפועל? מממ אולי. אם הטקסט קצר יחסית, אז אולי זה מגע נחמד. כך מכרתי את זה לעצמי בעת עיצוב מחדש של האתר שלי א לפני כמה שנים. זה לא ככה היום, אבל ככה זה נראה אז:
אבל מאמר שלם וארוך מפוצל לטורים? אני אוהב את זה בעיתונים אבל מהסס לגלול למטה דף אינטרנט כדי לקרוא טור אחד, רק כדי לגלול אחורה כדי לעשות זאת שוב.
אני מניח שאנחנו יכולים להשתמש בו כדי למקם שני אלמנטים זה לצד זה, אבל flexbox מתאימה הרבה יותר לכך. בנוסף, מגבלה מונעת מאיתנו לבחור את העמודות לגודלן בנפרד. על העמודות להיות באותו רוחב.
דבר אחד שעומדים בפניהם בעמודות הוא שהם שיטת פריסת ה-CSS היחידה שעושה זאת ברים תוֹכֶן. (כלומר, אלא אם כן אנחנו סופרים אזורי CSS... מה קרה לאלה, בכל מקרה?!) אז אם אתה רוצה לפצל פסקה לעמודות, זה כבר אפשרי ללא עטיפות נוספות.
מתי אולי תצטרך לפצל בלוק רציף של תוכן לעמודות? אני זוכר שהייתי צריך לעשות את זה כשהייתה לי רשימה גדולה, לא מסודרת של פריטים. אני אוהב את הדרך שבה רשימות יכולות להקל על סריקה של תוכן, אבל רשימות ארוכות יכולות לגרום לצד אחד של הדף להיראות כבד במיוחד. נניח, למשל, שרשמנו את כל תגי הפוסטים עבור CSS-Tricks בקבוצות אלפביתיות. פריסה מרובת עמודות עובדת יפה בשביל זה:
קדימה, נסה לשנות את גודל רוחב יציאת התצוגה. שלוש עמודות מוגדרות אך המספר ישתנה בהתאם לכמות השטח הפנוי. אני חייב לאהוב את כל הטוב המגיב הזה בלי עבודת שאילתת המדיה!
עבדתי על הדגמה עבור :left פסאודו-קלאס והגיע ל columns כי זו דרך מצוינת לפצל דברים להדפסת הדגמות. אז אני מניח שיש עוד מקרה שימוש. ותוך כדי ביצוע הדגמה, הבנתי שניתן להשתמש בפריסה מרובת עמודות ליצירת רשת בנייה של פריטים, כמו גלריית תמונות:
אבל מה עוד? האם אנו מוגבלים לפסקאות קצרות, רשימות ארוכות ורשתות זורמות חופשיות?
