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

Product preview card components solution

P

@danyela2000

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Joachim 840

@Thewatcher13

Posted

  • Why did you use the sup tag on your old price?
  • On decorative pictures/icons should be no alt text
  • Your button has no type (type:button)
  • Why did you used the images as background?
0

P

@danyela2000

Posted

@Thewatcher13

  • A button element outside of a form has type=button as its default value.
  • Since the left image was purely decorative, I decided to use it as a background image instead of using it as an img element.
  • For the rest, I corrected them.
0
Joachim 840

@Thewatcher13

Posted

  • A button element outside of a form has type=button as its default value.

that's not right.

On the w3c source you can see that if the type attribute is missing the default type=submit. https://www.w3.org/TR/2011/WD-html5-20110525/the-button-element.html#attr-button-type

You can see this on your site in the devtools.

Go to devtools>first select elements tab (select your button element)>now on the other part go to property's> scroll untill you see "type"> change your type of the button and you see that is standard "submit".

0
P

@danyela2000

Posted

@Thewatcher13 It means I understood wrong the default type of the button element. 😅 Perhaps some versions of browsers have this default type for buttons. Thanks for correction.

0
Joachim 840

@Thewatcher13

Posted

You're welcome!

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