Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
Hi here is my solution for Project-tracking-intro. I used HTML, CSS , JS.
Community feedback
- @Code-BeakerPosted 5 months ago
Hi there, Congratulations on completing this challenge... I see that you've done a great job with this one...! 🎉
- I noticed that the Image was overflowing the screen on desktop screen. I could see this because there was a horizontal scrollbar on the site.
- Make sure to use elements/tags that actually meet the purpose of what you're trying to achieve. Instead of using
div
, make use of theimg
tag for the images
Hope this is helpful to you... 😄
Marked as helpful1@Lo-DeckPosted 5 months agoHi @Code-Beaker and thanks for your comment.
I didn't see the overflow and set new properties to avoid it.
width: 50%; background: url(./images/illustration-devices.svg) no-repeat 0 0 / cover;
I used
background
to have a better positioning with my image and in fact avoid the overflow.Previously I worked with
<img>
for a background and struggled with positioning and overflow, so I used this method with this website.1
Please log in to post a comment
Log in with GitHubJoin 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