Skip to content
OverviewSolutions
4
Comments
4
Adeleke Bright
@adeisbright

All comments

  • Leslie Bagalho•90
    @lesliebagalho
    What are you most proud of, and what would you do differently next time?

    Me orgulho de ter conseguido mais um desafio, mesmo que seja para iniciantes.

    What challenges did you encounter, and how did you overcome them?

    Depois de muito estudo, consegui fazer a parte de Nutrição com apenas div e para estilizar usei Grid.

    What specific areas of your project would you like help with?

    Ainda tenho pouca experiência em assuntos mais avançados de CSS. Mas, conforme vou avançando, creio que vou superando.

    Landing Page usando CSS e Grid

    #accessibility
    1
    Adeleke Bright•40
    @adeisbright

    The width of the border line for your nutrition section is too wide because you are using the <hr> element.

    You can create a border line using :

    .nutrition-card-div:not(:last-child) {
  border-bottom: 1px solid var(--stone100);
}
  • Adeleke Bright•40
    @adeisbright

    Absence of <main> semantic , the main content should be grouped using this element.

    The page shrugs on smaller screen. The design can start first for mobile then adjust to larger screens.

  • Adeleke Bright•40
    @adeisbright

    Did you start the design on smaller screen ?

    Because I tried checking with dev tools and at a given breakpoint of 269px , the site broke.

    The use of fixed height for the card body made it to not be responsive.

  • Adeleke Bright•40
    @adeisbright

    Absence of relative units for some web elements. For example, the card is strictly sized as 497px

    And there is also absence of media queries for the styling.

    The CSS should be placed in its own folder for easy management.