column

یک صفت جدید CSS هست که به شما این اجازه را می‌دهد که متن چند ستونی داشته باشید، ببینید:

.three-column {
  padding: 1em;
  -moz-column-count: 3;
  -moz-column-gap: 1em;
  -webkit-column-count: 3;
  -webkit-column-gap: 1em;
  column-count: 3;
  column-gap: 1em;
}
<div class="three-column">
نفس باد صبا مشک فشان خواهد شد/عالم پیر دگرباره جوان خواهد شد/ارغوان جام عقیقی به سمن خواهد داد/چشم نرگس به شقایق نگران خواهد شد/این تطاول که کشید از غم هجران بلبل/تا سراپرده گل نعره زنان خواهد شد/گر ز مسجد به خرابات شدم خرده مگیر/مجلس وعظ دراز است و زمان خواهد شد/ای دل ار عشرت امروز به فردا فکنی/مایه نقد بقا را که ضمان خواهد شد/ماه شعبان منه از دست قدح کاین خورشید/از نظر تا شب عید رمضان خواهد شد/گل عزیز است غنیمت شمریدش صحبت/که به باغ آمد از این راه و از آن خواهد شد/مطربا مجلس انس است غزل خوان و سرود/چند گویی که چنین رفت و چنان خواهد شد/حافظ از بهر تو آمد سوی اقلیم وجود/قدمی نه به وداعش که روان خواهد شد
</div>

ستون‌های CSS خیلی جدید هستند، پس باید آنها را با پیشوند استفاده کنید، همچنین در IE8 به قبل و Opera Mini کار نمی‌کند. همچنین چند صفت دیگر مربوط به ستون‌ها هستند که از اینجا قابل دسترسی هستند. اگر مشتاق به آنها نیستید، به بخش بعدی برویم.

  • Creative Commons License