Basic HTML & CSS

Community feedback

• 

  Martin•1,150

  @ringmPosted about 4 years ago

  Hey Allison! Great job, the site looks really good! Well done.

  Regarding your question, I would suggest trying a layout with flexbox like this:

  .container {
    width: min(90%, 1100px);
    margin: 0 auto;
  }
  
  .row {
    display: flex;
    flex-direction: column;
  }
  
  .col {
    width: 100%;
  }
  
  @media (min-width: 600px) {
    .row {
      flex-direction: row;
    }
  }
  

  <div class="container">
    <div class="row">
      <div class="col">H1 and text</div>
      <div class="col">Ratings</div>
    </div>
    <div class="row">
      <div class="col">Comment 01</div>
      <div class="col">Comment 02</div>
      <div class="col">Comment 03</div>
    </div>
  </div>
  
  

  This would take care of the overall layout both for mobile and desktop, I hope it helps!

  Happy coding!

  1

  ---

  

  Allison Bates•170

  @allisonkbatesPosted about 4 years ago

  Ah that makes sense, thanks! I'll have to try it out!

  0