Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Javascript Slider | Testimonials | Mobile Friendly

Alan 335

@alanhcrdz

Desktop design screenshot for the Coding bootcamp testimonials slider coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Any feedback is welcome, I'll appreciate!

Community feedback

Shashi Lo 1,345

@shashilo

Posted

Good job Alan. Visually, this is close to the design. I like the hover state for the arrows. It's very subtle but effective.

You are missing some details within the design and I'd restructure your display styles.

  1. Image is not in the correct position based off the background image.
  2. Image is missing border-radius and the box-shadow is too heavy.
  3. Font weight and color do not match the design.
  4. If you wrap a .container around you section with a. max-width, it will be easier to control the position of your columns. Also, I'd avoid using position: absolute in this instance. This can be accomplished using just Flexbox.
  5. On mobile, the second slide's title is missing.
1
Alan 335

@alanhcrdz

Posted

Thank you! it's great to have your feedback, looks like I've yet missed some details.

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord