الگو:دایره های کنار هم: تفاوت میان نسخه‌ها

بدون خلاصۀ ویرایش
بدون خلاصۀ ویرایش
خط ۱: خط ۱:
<div style="display: flex; flex-direction: row; flex-wrap: wrap; gap: 2px; justify-content: center; align-items: flex-start; width: 100%; margin: 10px 0;">
<div style="display: flex; flex-direction: row; flex-wrap: wrap; gap: 0px; justify-content: center; align-items: flex-start; width: 100%; margin: 5px 0;">
     <!-- نکته فنی: مقدار gap در div اصلی بالا را می‌توانید به 1px یا 0px کاهش دهید -->
     <!-- نکته فنی: مقدار gap در div اصلی بالا را می‌توانید به 1px یا 0px کاهش دهید -->


     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 22%; min-width: 120px; gap: 2px;">
     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 18%; min-width: 120px; gap: 2px;">
         {{کانتینرعکس دایره|تصویر={{{تصویر1|}}}}}
         {{کانتینرعکس دایره|تصویر={{{تصویر1|}}}}}
         {{#if:{{{کپشن1|}}}|
         {{#if:{{{کپشن1|}}}|
خط ۹: خط ۹:
     </div>
     </div>


     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 22%; min-width: 120px; gap: 2px;">
     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 18%; min-width: 120px; gap: 2px;">
         {{کانتینرعکس دایره|تصویر={{{تصویر2|}}}}}
         {{کانتینرعکس دایره|تصویر={{{تصویر2|}}}}}
         {{#if:{{{کپشن2|}}}|
         {{#if:{{{کپشن2|}}}|
خط ۱۶: خط ۱۶:
     </div>
     </div>


     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 22%; min-width: 120px; gap: 2px;">
     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 18%; min-width: 120px; gap: 2px;">
         {{کانتینرعکس دایره|تصویر={{{تصویر3|}}}}}
         {{کانتینرعکس دایره|تصویر={{{تصویر3|}}}}}
         {{#if:{{{کپشن3|}}}|
         {{#if:{{{کپشن3|}}}|
خط ۲۳: خط ۲۳:
     </div>
     </div>


     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 22%; min-width: 120px; gap: 2px;">
     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 18%; min-width: 120px; gap: 2px;">
         {{کانتینرعکس دایره|تصویر={{{تصویر4|}}}}}
         {{کانتینرعکس دایره|تصویر={{{تصویر4|}}}}}
         {{#if:{{{کپشن4|}}}|
         {{#if:{{{کپشن4|}}}|
خط ۳۰: خط ۳۰:
     </div>
     </div>


     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 22%; min-width: 120px; gap: 2px;">
     <div style="display: flex; flex-direction: column; align-items: center; flex: 1 1 18%; min-width: 120px; gap: 2px;">
         {{کانتینرعکس دایره|تصویر={{{تصویر5|}}}}}
         {{کانتینرعکس دایره|تصویر={{{تصویر5|}}}}}
         {{#if:{{{کپشن5|}}}|
         {{#if:{{{کپشن5|}}}|