@AlexBueckig
Posted
Hi @descifle,
your card aren't shrinking because your .card has a fixed width set. If you want them to shrink try max-width instead of width. max-width allows them to scale down if they don't have enough room left to span the whole width.
@sarah27h
Posted
@descifle Thanks for your feedback, I decided to use JS to create HTML for cards because the code of card is repeated. And when Matt reviewed my challenge he told me that it’s a bad practice in this instance for those reasons.
- Injecting the content using JS will hurt your SEO.
- Users who disable JS won’t be able to view the content.
- The site will load slower.
- Use HTML, CSS and a little bit of JS for form validation for simple landing pages.
- Use more JS when building larger-scale applications.
He gives the
Frontend Mentor platformas an example for larger-scale applications, he used React and used NextJS to make use of server-side rendering so that the SEO for the site doesn’t take a hit.
So I need to refactor it again :) and use HTML and CSS.
@sarah27h
Posted
Great job @descifle, your design is responsive for all sizes. I recommend to
- Add margin top and bottom to the main element and remove
padding-top: 4rem;.
@descifle
Posted
@sarah27h Thank you! I looked at yours and it's very responsive as well. I'm just intrigued about the Javascript. I haven't learned Javascript yet. Can you tell me why you chose to use Javascript rather than CSS?
