Skip to content
Submitted about 4 years ago

Responsive layout using flex and grid

Yudi Yoshida•350
@yudiyoshida
A solution to the Social proof section challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hello guys! How are you?

I was thinking, there are two ways of importing fonts: in the HTML file using <link> and in the CSS file using @import.

Which way is better? Is there any difference?

Thank you!

Code
Couldn’t fetch repository

Please log in to post a comment

Log in

Community feedback

  • Vitor Lacerda•150
    @vitorlfaria

    Ficou muito bom Yudi! O responsivo também, ficou bom em todos os viewports que testei. Parabéns!

  • ApplePieGiraffe•30,525
    @ApplePieGiraffe

    Hello, Yudi Yoshida! 👋

    Good job on this challenge! 👏 Your solution looks good and is responsive! 👍

    I suggest,

    • Perhaps adding a max-width to some of the elements of the page (such as the hero text and the review boxes) so that they don't become too wide on extra-large screens (but that's a small thing for the design of this project, really).
    • Taking a look at your solution report and trying to clear up some of the errors that are there. It's generally recommended to include a heading in each <section> or <article> tag you use to identify that element.
    • If you're up for it, adding an intermediary/tablet layout between the desktop and mobile layouts of this challenge would be a nice touch. 😉

    And about your question—I believe using a <link> tag to include fonts for a website is slightly better than using the @import syntax. 🙂

    Keep coding (and happy coding, too)! 😁

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord