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

Advice generator app solution

#bem#fetch#gulp#sass/scss
Joanna• 370

@JoannaLapa

Desktop design screenshot for the Advice generator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi Everyone!

It would be nice to get any feedback. I found some difficulties with keeping the design layout of project with the longest advices which runned into a pattern-divice. The problem which I didn't resolve - I see that with the longest adivce the small part of vertical lines disappear and I don't know what cover it. If someone is able to suggest me anything or explain what cause the problem it would be great.

Community feedback

Luis Castillo• 380

@lipe11

Posted

Hi, your solution looks great, and very clean.

I tried to find long quotes but didn't get to one that showed the overlapping issue you mentioned. However, I did notice a lot of fixed heights in your CSS.

I'll leave a video that might help you solve your issue, it has a segment on fixed heights (in fact, the whole channel has great CSS stuff)

As a side note, the code link from your solution is linked to another repository ;)

Cheers.

Marked as helpful

1

Joanna• 370

@JoannaLapa

Posted

@lipe11 Thank you for your feedback and linked film that was very helpful for me. In a meantime I corrected a little bit my layout with flex and the problem with the pattern-divice seems to be resolved, that's why you didn't found it.

Anyway with your video I learnt about min-height and max-width and clamp() what would help me to avoid such problems in the future and make my projects more responsive. I'm going to improve my code with those rules.

You're right I attached the wrong repository, thank you I change it immediately.

Cheers, Joanna

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