Adam Argyle
בקודלאב הזה תלמדו איך לשתף ולהציג את הדרך המועדפת עליכם לרכז רכיבים ב-CSS.
מומלץ לקרוא את הפוסט שלי בבלוג מירכוז ב-CSS כדי ללמוד על 5 מהדרכים האהובות עלי למרכוז ב-CSS. אפשר גם לצפות בסרטון הזה.
הגדרה
- לוחצים על Remix to Edit כדי לאפשר עריכה של הפרויקט.
- פתיחה של
app/index.html - בשדה
line 23, מחליפים את/* your centering CSS here /*ב-CSS שלכם - (אופציונלי) נותנים שם לשיטת התיכון ומחליפים את הטקסט ב-
<h1>
סגנונות
- יצירת קובץ חדש בתיקייה
app/css/ - יוצרים סלקטור שיאחסן את הפתרון למרכוז, כמו
.turbo-centerאו[floaty-mcfloat] - בבורר החדש, כותבים את שיטת התיכון (אפשר להיעזר בדוגמאות של שיטות אחרות בקובץ
app/css/) - (אופציונלי) כותבים כמה 'סגנונות תמיכה' כדי שנוכל לראות אילו צאצאים צריכים סגנונות כדי לתמוך במרכוז
- פותחים את
app/css/index.cssומבצעים ייבוא של הקובץ החדש בתחתית המסך.
סיכום כל הפרטים
- פותחים שוב את
app/index.html. - מחפשים את
<article>ומגדירים לו את הסלקטור בהתאמה אישית שיצרתם בשלב 2 בקטע הקודם. - צייצו לי את הבאג ואציג אותו בפוסט בבלוג!