USED HTML5 CSS3 FLEXBOX GRID

Community feedback

• 

  Raymart Pamplona•16,100

  @pikapikamartPosted almost 3 years ago

  Hey, awesome work on this one. Desktop layout looks fine, just that they are bit wider than the design. The mobile state looks great but your breakpoint of 1300px is too early and too big for the whole mobile state to occupy since desktop layout could use more of those screen-time.

  Sergio Herrera already gave a feedback on this one , just going to add some suggestions as well:

  • For this, you can just only have a single landmark element, a main tag. The .card__wrapper selector could use the main tag and you can just remove the header and footer. Usually, when you are using header and footer as sectioning and not landmark, they are used inside the article from I what I use and currently know since they section the content of it.
  • Lastly, just adjusting the breakpoint:>

  The site actually looks great and doesn't need that much refactor. Again, great job on this one.

  Marked as helpful

  0
• 

  Sergio Herrera•140

  @santi19999Posted almost 3 years ago

  @OlafZiorko Hola! Muy limpio tu diseño y se adapta a los requisitos estipulados por el desafío.

  Una cosa muy mínima que me di cuenta, que cuando traduces la página a español en el punto de interrupción de 1300px, el h1 crece de tal manera que empuja todo el contenido hacia abajo, lo que hace que se corte el párrafo que está debajo.

  Lo inspeccioné y encontre una posible solución, en (.card__wrapper) aumenté el tamaño de la fila que contiene el h1 y el párrafo, luego disminuí la fila siguiente en el (grid-templates-rows), para que coincidan los tamaños de la tarjeta. O puedes combinarlo con el tamaño de la fuente del h1 también.

  Espero que me hayas entendido. Saludos..

  Marked as helpful

  0
• 

  Olaf Ziorko•510

  @OlafZiorkoPosted almost 3 years ago

  Sé exactamente lo que está pasando, decidí hacer esto pensando que nadie aumentaría el tamaño de la fuente.

  0