تبدیل float به flexbox

بعد از یادگیری مفاهیم اولیه مبحث flexbox، کافیه مثال آخر دوره ی موجود در سایت رو ببینید تا دستتون بیاد چطوریاس.
شروع کنید به نوشتن می بینید کاملا شدنی هستش.

ممنون می شم این فایل رو بررسی کنید ببینین اوکی هست و اگه راهنمایی ای هست بیزحمت اینجا برای استفاده من و دوستان قرار بدید ممنون

@hesammousavi
@milad

فایل تون رو بررسی کردم، به خوبی و زیبایی نوشتید.

من چندتا مورد کوچیک رو بهش اضافه کردم:

 /* For desktop: */
      .col-1  {width: 8.33%;}
      .col-2  {width: 16.66%;}
      .col-3  {width: 25%;}
      .col-4  {width: 33.33%;}
      .col-5  {width: 41.66%;}
      .col-6  {width: 50%;}
      .col-7  {width: 58.33%;}
      .col-8  {width: 66.66%;}
      .col-9  {width: 75%;}
      .col-10 {width: 83.33%;}
      .col-11 {width: 91.66%;}
      .col-12 {width: 100%;}

      @media only screen and (max-width: 768px) {
        /* For mobile phones: */
        main {
          flex-direction:   column;       
        }
        [class*="col-"] {
            width: 100%;
          }
      }

چسباندن footer به انتهای صفحه:

.container {
        min-height:             100vh;
        margin:                   auto;
        display:                  flex;
        flex-direction:       column;
      }

main {
        display:            flex;
        flex-direction:     row;
        flex: 1;        
      }     

محتواتون انگلیسی هستش، بهتره همون چپ به راست باشه، نه راست به چپ.

body, html {
        direction:          ltr;
      }

در کل، به زیبای نوشتید و مشخصه که درک خوبی پیدا کردین ازین مبحث، مواردی که من نوشتم جزئی بودند.

موفق باشید.

ممنون @milad