Skip to content
OverviewSolutions
11
Comments
4
Synchronize
@TheCookieNoid

All comments

  • Synchronize•120
    @TheCookieNoidPosted 4 months ago

    Great!

    0
  • kapowlo•80
    @kapowloSubmitted 4 months ago
    What are you most proud of, and what would you do differently next time?

    Font weight was not working for the variable font, I should've specified a range then used font-variation-settings(not mandatory). like this

    @font-face {
  font-family: 'Inter';
  font-weight: 100 900;  
  src: url(Inter-VariableFont_slnt\wght.ttf) format("truetype"))
} 

h1{
  font-family: 'Inter';
  font-variation-settings: 'wght' 500; /*can get away with font-weight:500; */
}
    What challenges did you encounter, and how did you overcome them?

    Was my first time using @font-face rule to load up custom fonts.I'm still not a hundred percent sure if this is the right way to do it.

    I always struggle with giving height to my body and container.Last time, when I used min-height on the body and had a height of 100% set on the container.The container wasn't filling up the whole page.So when I have a container and I want that container to take up the full page, is this the correct way?

    body {
/*last time i used min-height here container wasn't taking up the full page  */
  height: 100vh; 
}
.container{
height:100%;
}

    So far i haven't had any issue with this

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

    Not sure but I'm always surprised at how different the web pages looks when I submit the solution, like padding/margin and width/height looks completely different.

    responsive-flexbox-social-links-profile

    1
    Synchronize•120
    @TheCookieNoidPosted 4 months ago

    Great work mate, could be improved using padding to push the attribution section a little below and using font size for header tags to find a better size, all around it was great tho!

    1
  • Synchronize•120
    @TheCookieNoidPosted 4 months ago

    For publishing date and the main paragraph you could use "font-weight:500" to give it a little boldness, nonetheless it looks good.

    0
  • Synchronize•120
    @TheCookieNoidPosted 4 months ago

    You can display the element as a flex and then use the "flex-direction :column" to push the "challenge by frontend mentor" part down, right below the container.

    0