Skip to content
OverviewSolutions
4
Comments
2
Eduardo Castro
@EduardoLimaCastro

All comments

  • Aayush Jha•410
    @Aayush895Submitted about 1 year ago

    This is the very first project that I have worked on, so if I made any mistake that seems silly, please forgive me for that. The problem that I faced when building this component was mainly for the responsive design.

    1.) When I was designing the component for a device whose screen size was 375px and below, the 'result-component' or the purple section (for ease of understanding) of the component had the upper half portion hidden. Now I found a quick workaround for that by adjusting the top position of the component but, it affected some devices whose size was slightly greater than 375px. Although the effects were pretty minor, I would love to see a more optimized solution for this problem.

    2.) I would love to get some feedback on my code quality and would love to know if there was a better way to solve this problem or not. Also, I will be grateful to get my hands on some resources that can help me to improve my code quality.

    3.) I would also love to get an opinion on how to write better README files for the projects.

    A simple responsive Result Summary Component using HTML and CSS

    2
    Eduardo Castro•150
    @EduardoLimaCastroPosted about 1 year ago

    Hello Aayush Jha,

    in your css change the value of top:68% to top:80% in your mobile mode

    @media (max-width: 820px) {
  #result-summary-body {
    display: grid;
    grid-template-columns: repeat(1, auto);
    width: 100%;
    top: 68%;
    border-radius: 0;
  }

  .result-component {
    padding: 2rem;
  }
}
    Marked as helpful
    0
  • Eduardo Castro•150
    @EduardoLimaCastroPosted about 1 year ago

    Hi Mumbi, think you forgot to put your assets/images folders in your github repository. Images are breaking on the live site.

    Marked as helpful
    0