All comments

• 

  AminForouzan•60

  @AminForouzan

  Submitted 30 days ago

  

  qr code component, using Flexbox

  1

  00
  

  stephenlit•60

  @stephenlit

  Posted 28 days ago

  Your link to preview the site is not working,

  1
• 

  Snigdha Sukun•550

  @snigdha-sukun

  Submitted 7 months ago

  What are you most proud of, and what would you do differently next time?

  I am proud of learning how to use custom marker in ul:

  ul {
      list-style: none;
      padding-bottom: 1em;
  }
  
  ul li:before {
      content: url('./assets/images/icon-list.svg');
      margin-right: 1em;
  }
  

  What challenges did you encounter, and how did you overcome them?

  I faced a challenge to get the dismiss button in the correct position in the mobile view. But after some trial and error, I was able to get it right:

  .success-message {
      padding: 1em;
      position: relative;
  }
  
      .dismiss-btn {
          position: absolute;
          bottom: 1em;
          width: calc(100% - 2em);
      }
  

  What specific areas of your project would you like help with?

  Responsive CSS & JS do's & don'ts

  

  Newsletter sign-up form

  #pure-css

  1

  40
  

  stephenlit•60

  @stephenlit

  Posted 7 months ago

  Great Job!

  Looks really good! I notice in your mobile view the heading image slides down when you shrink the size down to 375px. I believe this is because of your align-items in your <main>.

  After your media query try adding a align-items: start to your main.

  main {
      background-color: var(--white);
      align-items: start;
  }
  

  I think this will stop the heading image from moving down as you shrink the screen size. I hope this was some help in some way, of course I could be wrong as well lol

  cheers!

  0