First time Responsive? Card container.

Community feedback

• 

  MikDra1•6,980

  @MikDra1Posted 2 months ago

  Great job on the structure and design! Here are a few suggestions:

  • The use of custom fonts through @font-face is well implemented, but ensure the font files are optimized for web to avoid performance issues. You could combine the similar font definitions (Text-preset3 and Text-preset4) to reduce redundancy.

  • The .container class uses display: flex with proper alignment and centering, which is excellent. However, the height: 60rem; may cause issues on smaller screens. Consider using min-height or 100vh for better responsiveness.

  • The styling of the .main-card is visually appealing with the box-shadow: 8px 8px; and rounded corners. Just be mindful of box-shadow performance on mobile devices, as large shadows can be resource-heavy.

  • For the text in the .text-card, the fonts and padding look good, but consider using relative units like rem or em for font-size and padding instead of fixed values. This will ensure better scalability across different screen sizes and user settings.

  • The hover effect on a tags switching to #f4d04e is a nice touch, but ensure that the contrast remains sufficient for readability.

  Hope you found this comment helpful 💗💗💗

  Good job and keep going 😁😊😉

  0
• 

  punitkotian•30

  @punitkotianPosted 2 months ago

  Your code is well-structured and effectively uses modern design practices.

  0