I'm a newbie to front-end development at the moment, but learning everything about it seems so exciting and engaging I'm sure I won't be for much longer!
I like the hover effects you added to the navigation links in the footer at the bottom of the page.
One thing, however, is that the images on the page aren't very responsive. Consider setting their width to a percentage of the viewport width or parent container so that they scale when the page is resized.
Just as an idea 🤔, you can experiment with the flex-direction and flex-wrap properties to have the cards break into two columns (and then eventually into a single column) when the width of their parent container becomes smaller. 😃
Otherwise, your solution already looks really good!
The wavy background SVG doesn't seem to stay in its place when the page is resized. I think you'd be able to fix that by setting background-size to cover and background-position to bottom.
Also, between 75rem and 62.5rem, the footer information seems to overflow its container and create some blank space to the right of the page, but that shouldn't be too difficult to fix provided you downsize the elements in that container and set its width to 100% of its parent container or something.
Latest Comments
RE: Mario Pavlović's "HTML and CSS and FLEXBOX" solution
Nice work, Mario Pavlović!
I like the hover effects you added to the navigation links in the footer at the bottom of the page.
One thing, however, is that the images on the page aren't very responsive. Consider setting their width to a percentage of the viewport width or parent container so that they scale when the page is resized.
Keep coding (and happy coding, too)!
RE: Nairobi Sheikh's "I used flex-box to create the mobile and desktop view." solution
Yup, good job!
Besides making your page responsive—perhaps consider adding a wee bit of padding to the bottom of your page to give those social icons some space.
😀
RE: Ryan's "Four card feature challenge" solution
Hey Ryan!
Nice work!
Just as an idea 🤔, you can experiment with the
flex-directionandflex-wrapproperties to have the cards break into two columns (and then eventually into a single column) when the width of their parent container becomes smaller. 😃Otherwise, your solution already looks really good!
Keep coding (and happy coding, too)!
RE: David Parsons's "Responsive landing page made with html and css" solution
Hey, David Parsons!
The wavy background SVG doesn't seem to stay in its place when the page is resized. I think you'd be able to fix that by setting
background-sizetocoverandbackground-positiontobottom.Also, between
75remand62.5rem, the footer information seems to overflow its container and create some blank space to the right of the page, but that shouldn't be too difficult to fix provided you downsize the elements in that container and set its width to 100% of its parent container or something.Otherwise, nice work!
Keep coding (and happy coding, too)!
RE: Jen's "Pricing component with toggle | SCSS & Vanilla JS | Mobile First" solution
Ooh... nice!
I like the hover states of the buttons in your solution.