Skip to content
OverviewSolutions
13
Comments
3
Noha Waheed
@nohawaheed

All comments

  • Noha Waheed•230
    @nohawaheedPosted 7 months ago

    Hello @pr0g4ng3l,

    Great job on completing the challenge!

    Your design for both large and small screens looks fantastic. I have a few tips to help improve your code.

    Instead of giving fixed heights like .full-section { height: 65vh;} consider using min-height: 100%; which allows the element to dynamically adjust its height based on the content within it or the height of its parent container.

    Additionally, you could use margin: auto; instead of using position: absolute and transform to center content.

    Position absolute is commonly used for elements that need to be positioned in a specific location on the page, such as overlays, tooltips, or dropdown menus.

    If you choose to remove the position, make sure to also remove the top property in .attribution { top: 90vh; }

    I suggest checking out Frontendmentor's learning path on Building responsive layouts if you haven't already. It provides excellent resources to help you develop responsive layouts.

    hope this helps!

    Marked as helpful
    0
  • Daniele Morello•100
    @DanieleMorelloSubmitted 7 months ago
    What are you most proud of, and what would you do differently next time?

    I like the layout.

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

    To move the cards left and right, I used position absolute and position relative, but I'm not sure that's the ideal solution.

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

    Is there a better solution to move the cards left and right than the one I used?

    four card feature section using Saas

    1
    Noha Waheed•230
    @nohawaheedPosted 7 months ago

    Hi @DanieleMorello,

    Congratulations on completing the challenge! 👏

    If you're looking to achieve a more desired layout design, I recommend exploring CSS Grid. It's a great tool for creating custom layouts. To learn more about CSS Grid, you can check out these resources:

    Complete Guide to Grid and CSS Grid Garden

    Happy coding!

    0
  • Noha Waheed•230
    @nohawaheedPosted 7 months ago

    Great job on completing the challenge! 👏

    I have a couple of suggestions to improve the structure and accessibility of your content. Consider using the <h1> heading element for the title instead of the <p> paragraph element. This will help establish clear hierarchy within your content and improve SEO.

    Additionally, utilizing the <main> element to contain all content related to the page's main idea can enhance the organization and structure of your web page. The <main> element serves as a key landmark that helps identify the primary focus of your content.

    For more information on heading elements, click here. For more information on landmarks, click here.

    I hope these suggestions are helpful! Good luck with your future projects!

    0