เลย์เอาต์ CSS แบบ 1 บรรทัดที่มีประโยชน์

• จัดกึ่งกลางแบบสุด ๆ { place-items: center }

• แพนเค้กที่แยกส่วน { flex: 0 1 }

• Sidebar Says { grid-template-columns: minmax(, ) ... }

• สแต็กแพนเค้ก { grid-template-rows: auto 1fr auto }

• เลย์เอาต์ Holy Grail แบบคลาสสิก { grid-template: auto 1fr auto / auto 1fr auto }

• กริด 12 คอลัมน์ { grid-template-columns: repeat(12, 1fr) }

• RAM (Repeat, Auto, Minmax) { grid-template-columns: repeat(auto-fit, minmax(, 1fr)) }

• เรียงให้พอดี { justify-content: space-between }

• Clamping My Style { clamp(, , ) }

• เคารพสัดส่วนภาพ { aspect-ratio: / }

[xguru]

จะเรียกว่าแค่ 1 บรรทัดก็อาจไม่เชิงนัก.. แต่ก็ดูน่าจะมีประโยชน์นะครับ