I would like to know if there is a better way to get around the problem with the Learn More buttons. When the <p> text moved to new lines with a shrinking window, it moved the buttons down. I came up with a solution, but it's not very elegant. Or maybe it is. I have no idea.
The buttons moving is expected behavior and is not a problem.
Really excited about frontend, being a backend engineer this is really fairly new for me. Would appreciate any feedback about the code.
Hello there,
Great job! It looks design perfect! However, I see you are using mainly px. They are good and easy to use while starting but try and explore more responsive friendly units like em and rem for spacing. This way the spacing will be more consistent and scalable with the font of the text. This way you can scale the font size and have the spacing automatically update as well.
Another thing for responsive friendly code is to avoid setting fixed width and height (for example width: 320px;). Try using % or padding(especially for height) for them. I can`t get much more in depth with responsiveness but remember that html is responsive by default and we should try not to break it with our css.
Lastly, I saw you are using mainly divs in the html. Explore semantic html and use some of the new html5 tags(main, header, section, article, etc.). Semantic html helps with SEO optimization.
Keep up the good work and don`t be discouraged by the big world of front end!
Should i be setting the width of the card manually or is there a better way? Feels wrong using max-width: 400px; on the card.
Max-width is good because it is responsive and allows for shrinking but it doesn`t let the container get too wide and produce very long lines of text which are very hard to read.
