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

Responsive card component using HTML5, SCSS, CSS

@februaryfourth

Desktop design screenshot for the Stats preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Is there a way i could have used less html and css code? How could I have made better use of SCSS? How do you ensure font size is responsive in order to avoid re declaring new sizes for larger screens?

Community feedback

Luis Colina 1,043

@Comet466

Posted

hello Urhiofe, you solution looks great! There's a litte poblem with the linking of the css you need to use the route "css/style.css" instead of "/css/style.css" you can see what a little mistake like that one can do, it happens, the same with the image url that you find in the css, in the mobile version the information stats elements need to show in a single column, and a little padding in the body would help the mobile version too, other than that looks good and is responsive, happy coding

0

@februaryfourth

Posted

@Comet466 Hey thanks so much for the feedback! i never noticed it created an error as it worked fine on my desktop. I've made the changes now!

Thanks again, t

0

Account Deleted

@Comet466 We can use any of those, please do visit this tutorial on absolute, relative and root relative links.

0
Luis Colina 1,043

@Comet466

Posted

@niharbarik in this case (at first it didn't show the css styling on the page) by taking out the "/" off the link route it applied the styling to the page, probably something to do with github

0
Alexey 390

@alexeykuz-sys

Posted

Hi Thomson. I think there is a problem either with the website link or your code.

0

@februaryfourth

Posted

@alexeykuz-sys Thanks for alerting me, there was an issues creating Github pages so i ended up using Codepen instead.

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