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

CSS flex and media query ( 390px )

Cyril Salamiteโ€ข 70

@Cyrilange

Desktop design screenshot for the Results summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I build this project mostly with flex , and I start the media query in 390px

I am new to learning development , please feel free to be honest so I can progress

My learning are javascript with react , html and Css ( with scss and bootstrap)

Community feedback

Rickyโ€ข 460

@rickyxyz

Posted

Fellow beginner here, so take this with a grain of salt ๐Ÿง‚.

I think this could be helpful for you BEM naming convention, since CSS names can get confusing quickly.

Cheers ๐Ÿป

Marked as helpful

2

Cyril Salamiteโ€ข 70

@Cyrilange

Posted

@rickyxyz

Thank you very much , this advise is a great help for me and for people looking at the project

cheers

0

@MelvinAguilar

Posted

Hello there ๐Ÿ‘‹. Good job on completing the challenge !

I have other suggestions about your code that might interest you.

  • Avoid using the <div> tag just for text. <div> is a generic container used for grouping content and applying styles, but it doesn't convey any semantic meaning. Similarly, avoid using <span> for entire blocks of text, <span> is an inline HTML element used to apply styles to specific parts of text without changing the structure or meaning, but this tag doesn't provide the same semantic value as other tags like paragraphs.
  • You should use aria-hidden="true" and focusable="false" in an SVG to improve accessibility. These attributes are essential to provide a better experience for users with disabilities, as they indicate that the SVG is decorative or non-interactive.

I hope you find it useful! ๐Ÿ˜„

Happy coding!

Marked as helpful

1

Cyril Salamiteโ€ข 70

@Cyrilange

Posted

@MelvinAguilar

Thank you , yes every comments is useful

0
Renukta-21โ€ข 130

@Renukta-21

Posted

Saw your code, and I think you could simplify much more your styles, also you can check the repeated styles that are in the same file, noticed you have tha same media-query distributed all along your file for different elements, I'm a beginner to btw, congrats!

Marked as helpful

1

Cyril Salamiteโ€ข 70

@Cyrilange

Posted

@Renukta-21

Thank you , I could have used mixing and variables indeed

1

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