Latest solutions
Latest comments
- @abanicaisse@Joseph1032
This looks great! Don't forget to add alternative text to your <img> elements to avoid the accessibility issues :)
<img src="" alt="alternative text">
- @CamiloGav@Joseph1032
I would just add more space between the paragraph text and the button so it looks more like the design example. Other than that, it looks good!
- @Nidhikumari-4@Joseph1032
Don't forget to add alt text to your images to prevent getting those HTML issues :)
<img src="" alt="">
- @CamiloGav@Joseph1032
Hi, Camilo. For the blue background, I would suggest taking a second look at the pseudo element ::before. Try using the background property instead of content for calling the eye image. It would look something like this:
content: " "; position: absolute; background: url(./images/icon-view.svg) cadetblue; background-repeat: no-repeat; background-position: center; height: 100%; width: 100%; opacity: 0;
You might need to re-work your HTML to get everything right, but it's a start :)
Marked as helpful - @Destiny-16@Joseph1032
To avoid this type of error from the Accessibility Issues: Heading levels should only increase by one
Ensure that you're not skipping heading levels. In your HTML, you have an <h2> on line 33 and then an <h4> on line 40, skipping <h3>. You can fix this simply by replacing <h4> with <h3> and your <h5> with <h4>.
Also, wrap your markup in <main></main> inside the <body> to avoid the landmark error from the Accessibility Issues as well.
Nice work :)
Marked as helpful