Desktop design

Active states

Modal design

Mobile design

Interactive comments section

<a href="https://www.frontendmentor.io?ref=challenge" target="_blank" rel="noopener noreferrer">Frontend Mentor</a>

<div class="profile">
            <img src="./images/avatars/image-amyrobson.webp" alt="">
            <p class="userName" id="profile-1">amyrobson</p>
            <span class="timeStamp">1 month ago</span>
          </div>

<div class="commentText">
            <p>Impressive! Though it seems the drag feature could be improved. But overall it looks incredible. You've nailed the design and the responsiveness at various breakpoints works really well.</p>
          </div>

<div class="profile">
            <img src="./images/avatars/image-maxblagun.webp" alt="">
            <p class="userName" id="profile-2">maxblagun</p>
            <span class="timeStamp">2 weeks ago</span>
          </div>

<div class="commentText">
            <p>Woah, your project looks awesome! How long have you been coding for? I'm still new, but think I want to dive into React as well soon. Perhaps you can give me an insight on where I can learn React? Thanks!</p>
          </div>

<div class="profile">
                      <img src="./images/avatars/image-ramsesmiron.webp" alt="ramsesmiron">
                      <p class="userName" id="profile-3">ramsesmiron</p>
                      <span class="timeStamp">1 week ago</span>
                    </div>

<div class="commentText">
                      <p>If you're still new, I'd recommend focusing on the fundamentals of HTML, CSS, and JS before considering React. It's very tempting to jump ahead but lay a solid foundation first.</p>
                    </div>

<div class="profile">
                      <img src="./images/avatars/image-juliusomo.webp" alt="juliusomo">
                      <p class="userName" id="profile-4">juliusomo</p>
                      <span class="timeStamp">2 days ago</span>
                    </div>

<div class="commentText">
                      <p>I couldn't agree more with this. Everything moves so fast and it always seems like everyone knows the newest library/framework. But the fundamentals are what stay constant.</p>
                    </div>

<div class="attribution">
      Challenge by
      <a href="https://www.frontendmentor.io?ref=challenge" target="_blank" rel="noopener noreferrer">Frontend Mentor</a>. Coded by <a href="#">Adams</a>.
    </div>

Please log in to post a comment

Community feedback

RESPONSIVE INTERACTIVE COMMENT SECTION USING HTML CSS JS

Solution retrospective

Please log in to post a comment

Community feedback

Join our Discord community