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-component-1-main

abdurahman-05β€’ 20

@Abdurahman-05

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison

SolutionDesign

Reports

Accessibility report (3)
error

Images must have alternate text

<img src="images/icon-cart.svg">
Learn more
warning

Document should have one main landmark

<html lang="en">
Learn more
warning

All page content should be contained by landmarks

<div class="all">
Learn more

abdurahman-05’s questions for the community

any question you can ask?

Community feedback

Souleymane Syβ€’ 250

@SouleymaneSy7

Posted

Hi πŸ‘‹@Abdurahman-05, congratulation for your solution.

To improve it, you should put the img tag in div and give 50% width of the parent element to make it take half of the parent size. And this will improve your solution to make it as close to the design provided!

Also it a good work

Marked as helpful

0


abdurahman-05β€’ 20

@Abdurahman-05

Posted

@SouleymaneSy7 tnk you souleyman for your comment but I did it like that and correct but I don't know why it change to this ?

0

Souleymane Syβ€’ 250

@SouleymaneSy7

Posted

@Abdurahman-05 I Just reviewed your code. the two children of the div with class "container", your have to give each of them 50% width of her parent element and remove the height you put on the div with "container" class. then on the img tag give "width: 100%" to make him take all the size of her parent element after that put a white background on the div with "flex" class.

0

Please log in to post a comment

Log in with GitHub
Slack logo

Join our Slack community

Join over 180,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!