Dynamic layout with CSS grid

Community feedback

• 

  Alim Asiidik•80

  @alimassidik210Posted 5 months ago

  Thank you, Sarah. Your advice is very inspiring to me. Good luck, Sarah.

  0
• 

  Sarah•580

  @AutumnsCodePosted 5 months ago

  Hi Alim,

  your solution looks close to the design.

  I can see some improvement in your HTML:

  • I would highly suggest of using semantic Html instead of using div-elements. I did an example how I would do it, but this is not the only solution

  <main class="container">
        <article class="one card">
          <header class="profil">
            <img src="./images/image-daniel.jpg" alt="Daniel" />
            <div class="graduate">
              <p>Daniel Clifford</p>
              <p>Verified Graduate</p>
            </div>
          </header>
          <section class="content">
            <h1>
              I received a job offer mid-course, and the subjects I learned were
              current, if not more so, in the company I joined. I honestly feel I
              got every penny’s worth.
            </h1>
            <p>
              “ I was an EMT for many years before I joined the bootcamp. I’ve
              been looking to make a transition and have heard some people who had
              an amazing experience here. I signed up for the free intro course
              and found it incredibly fun! I enrolled shortly thereafter. The next
              12 weeks was the best - and most grueling - time of my life. Since
              completing the course, I’ve successfully switched careers, working
              as a Software Engineer at a VR startup. ”
            </p>
          </section>
        </article>
      </main>
  

  • in each html side should only have one h1-element per page. In this challenge,, I would use h1 for the first one, and h2 in the second one and just applying the same styling to both.
  • I would also suggest to put the css file into a seperate file, this is quiete a common practice.

  Best regards, Sarah

  0