Order summary component solution using Flexbox

Community feedback

• 

  Kyrylo Haiduk•420

  @superpooperxxxPosted almost 2 years ago

  Hi, really great job 🔥 By first glance at your code I see that you are moving in the right direction !

  Small tips

  • I see that you are using BEM. This is incorrect ⬇️ Element cannot have own elements and seems like img is the element of element plane. So name it card__img which in code is inside card__plan. Read this

  class="card__plan__img"
  

  Just, so you understand better ➡️ You have block card everything inside are elements. Elements can be inside each other in code BUT class names must not display this.

  This would be correct ⬇️

          <div class="card__plan">
            <img
              class="card__img"
              src="./images/icon-music.svg"
              alt="Music tune icon"
            />
            <div class="card__plan-wrapper">
              <div class="card__plan-duration">Annual Plan</div>
              <div class="card__plan-price">$59.99/year</div>
            </div>
            <input
              type="button"
              class="card__plan-change-btn"
              value="Change"
            />
          </div>
  

  Happy coding❤️ Hope this was helpful

  Marked as helpful

  0

  ---

  

  Imran Khan•370

  @astr0n0merPosted almost 2 years ago

  @superpooperxxx Thank you for the feedback

  I see I misunderstood BEM a little bit. Thanks for pointing it out😁

  0