ขณะนี้พร็อพเพอร์ตี้ปรับเนื้อหาสำหรับเลย์เอาต์แบบบล็อกเป็นส่วนหนึ่งของเกณฑ์พื้นฐานแล้ว

เผยแพร่: 17 เมษายน 2024

ตอนนี้คุณใช้align-contentพร็อพเพอร์ตี้จากการจัดแนวกล่อง CSS ในเลย์เอาต์บล็อกและตารางได้แล้ว ซึ่งจะช่วยให้จัดแนวบล็อกได้โดยไม่ต้องสร้างเลย์เอาต์ Flex หรือ Grid

Browser Support

  • Chrome: 123.
  • Edge: 123.
  • Firefox: 125.
  • Safari: 17.4.

Flexbox และ Grid ช่วยให้การจัดกึ่งกลางรายการในแนวตั้งซึ่งเคยเป็นเรื่องยากกลายเป็นเรื่องง่าย รวมถึงพร็อพเพอร์ตี้ align-content แต่ก็ต้องสร้างเลย์เอาต์ Flex หรือ Grid โดยไม่มีเหตุผลอื่นนอกเหนือจากการจัดแนวนี้ มีการระบุพร็อพเพอร์ตี้สำหรับเลย์เอาต์บล็อก และในช่วง 2-3 เดือนที่ผ่านมา เครื่องมือหลักทั้ง 3 รายได้เปิดตัวฟีเจอร์นี้

เมื่อใช้ align-content สำหรับเลย์เอาต์บล็อก คุณจะจัดแนว แนวตั้งได้โดยไม่ต้องสร้างเลย์เอาต์ Flex หรือ Grid สำหรับพร็อพเพอร์ตี้เพื่อให้ ทำงาน ไม่จำเป็นต้องมีพร็อพเพอร์ตี้เพิ่มเติมเนื่องจากรายการยังคงเป็นรายการบล็อก การเปลี่ยนแปลงเพียงอย่างเดียวคือการจัดแนว

พร็อพเพอร์ตี้ align-content จะจัดกึ่งกลางส่วนหัวในแนวตั้งภายในคอนเทนเนอร์บล็อก