קטגוריית מדריכים: CSS

איך משתמשים ב Container Query

אחד הכלים החזקים ביותר שנכנסו לשימוש ב css הוא ה Container Query, שנותן לנו אפשרות להגדיר את העיצוב שלנו בהתאם לגודל של חלק ספציפי בעמוד שלנו, ולא רק לפי הגודל של המסך. על מנת להשתמש בתכונה הזו, ראשית עלינו להגדיר את הקונטיינר. הקונטיינר יכול לקבל שתי תכונות: container-type ו- container-name. container-name כשמה כן היא. התכונה […]

איך דוחפים תוכן ב Flex box

יש כמה דרכים לשלוט במיקום התוכן ב Flex box, אבל אם רוצים לדחוף תוכן ספציפי, הדרך הפשוטה ביותר היא עם margin: auto. אם תסתכלו על הדוגמה הבאה: נוכל לסדר את התוכן כך: התוצאה שתתקבל במצב כזה, היא שתי קוביות שצמודות לצד שמאל של המסך, בעוד שהקוביה הימנית נצמדית לצד הימני. השיטה הזאת יעילה במיוחד כאשר […]

איך מקצצים טקסט אחרי מספר נתון של שורות?

מכירים את זה שאתם בונים אתר עם עיצוב מוקפד וגריד מדויק ברמת הפיקסל שנראה בדיוק לפי המוקאפ שקיבלתם מהמעצב, ואז הלקוח ממלא את אחד מהכרטיסים בעמוד הבית בטקסט ומתלונן על זה שהאתר לא נראה כמו בעיצוב שקיבלתם? בדיוק בשביל מקרים כאלה נועד line-clamp, שיודע לחתוך את הטקסט הנתון בתוך בלוק כלשהו אחרי מספר נתון של […]

איך ממרכזים תוכן ב CSS?

אחת השאלות הנפוצות ביותר שנשאלות על ידי מפתחי CSS מתחילים היא איך למרכז את התוכן שלנו ביחס למסך או ל Div האב של התוכן. יש לא מעט דרכים לעשות את זה, כאשר כל אחת מהשיטות מייצגת גישה שונה לחלוטין של ארכיטקטורת CSS. אנחנו נסקור כאן את הנפוצות ביותר, בהתאם לצרכים השונים שלכם. מרכוז תוכן בתוך […]