دایره های کنار هم - فراغیب
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش برچسب: واگردانی دستی |
Esfandiari (بحث | مشارکتها) بدون خلاصۀ ویرایش |
||
| خط ۱: | خط ۱: | ||
<div style="display: flex; flex-direction: row; flex-wrap: wrap; gap: | <div style="display: flex; flex-direction: row; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: flex-start; width: 100%; margin: 5px 0;"> | ||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 | <!-- تکرار برای هر ۵ آیتم --> | ||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 200px; max-width: 250px; gap: 2px;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر1|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر1|}}}}} | ||
{{#if:{{{کپشن1|}}}| | {{#if:{{{کپشن1|}}}| | ||
<div style="font-size: 1em; text-align: center | <div style="font-size: 1em; text-align: center;">{{{کپشن1}}}</div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 | <!-- برای آیتمهای بعدی هم از همین استایل flex: 1 1 200px استفاده کنید --> | ||
<!-- ... --> | |||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 200px; max-width: 250px; gap: 2px;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر2|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر2|}}}}} | ||
{{#if:{{{کپشن2|}}}| | {{#if:{{{کپشن2|}}}| | ||
<div style="font-size: 1em; text-align: center | <div style="font-size: 1em; text-align: center;">{{{کپشن1}}}</div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 200px; max-width: 250px; gap: 2px;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر3|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر3|}}}}} | ||
{{#if:{{{کپشن3|}}}| | {{#if:{{{کپشن3|}}}| | ||
<div style="font-size: 1em; text-align: center | <div style="font-size: 1em; text-align: center;">{{{کپشن1}}}</div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 200px; max-width: 250px; gap: 2px;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر4|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر4|}}}}} | ||
{{#if:{{{کپشن4|}}}| | {{#if:{{{کپشن4|}}}| | ||
<div style="font-size: 1em; text-align: center | <div style="font-size: 1em; text-align: center;">{{{کپشن1}}}</div> | ||
}} | }} | ||
</div> | </div> | ||
<div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 200px; max-width: 250px; gap: 2px;"> | |||
{{کانتینرعکس دایره|تصویر={{{تصویر5|}}}}} | {{کانتینرعکس دایره|تصویر={{{تصویر5|}}}}} | ||
{{#if:{{{کپشن5|}}}| | {{#if:{{{کپشن5|}}}| | ||
<div style="font-size: 1em; text-align: center | <div style="font-size: 1em; text-align: center;">{{{کپشن1}}}</div> | ||
}} | }} | ||
</div> | </div> | ||
</div> | </div> | ||