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

stats preview card-component main challenge solution using Html & css

vishal wankhade• 495

@Vishal-wankhade

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


hey I am vishal wankhade, this is my first challenge on frontend mentor. review it give your valuable feedback. love

Community feedback

P

@gsterczewski

Posted

Hello Vishal-wankhade 👋, my name is Grzegorz.

I think you set incorrect url for background-image, for now it doesn't show up.

I would also rethink usage empty article for displaying image as a background.

article should be used for displaying stand-alone content, right now there is no content at all. Perhaps img element would be more suitable here.

I hope this will be helpfull to You.

Keep up the good work! 💪

See you on the coding trail 😉

Cheers!

Marked as helpful

0

vishal wankhade• 495

@Vishal-wankhade

Posted

@GSterczewski No, I have given the accurate path and it's showing the image in my browser , I don't no why it's not showing here. for the background image , image tag would be better I agree with you. thanks for the feedback

0
P

@gsterczewski

Posted

@Vishal-wankhade

I can see the image when I change the path from images/image-header-desktop.jpg to image-header-desktop.jpg On your github source code, you don't have the images folder.

1
vishal wankhade• 495

@Vishal-wankhade

Posted

@GSterczewski oh ok thank you got it now.

0

@IEdiong

Posted

Hello Vishal 👋

Congratulations on your first FEM Challenge.

Here are some things you should look into:

  • Your use of semantic tags, eg you shouldn't have more than one <h1> tag in your page. Other matters that relate to this are in the report above.
  • Your image seems not to be displaying on small screen sizes.
  • You could remove border-radius: 10px; from .image and #overlay, then put it only in the div.contianer and also set overflow: hidden; on it too.
  • Also look into working on your responsiveness.

I hope this was helpful, happy coding 💻🥂

Marked as helpful

0

vishal wankhade• 495

@Vishal-wankhade

Posted

@IEdiong thanks for the feedback. I only made the responsiveness design for 375px as given in guidelines with max-width 500px . and showing the images in my browser. about the border radius, it was a better option to go with .

as I am new here . don't why it's not showing the image here. everything correct and totally working in my browser would you tell what could be the problem here

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