Blog Preview Card Using BEM CSS Styling and Flexbox

Community feedback

• 

  Alyfer Jacobsen•450

  @AlyferJT

  Posted 10 months ago

  Well, the view code page is going to 404, you changed the project name. But, congratulations!

  The thing about rem is root-em, he is a size unit based on the root value, since the default root value is 16px in most cases

  .5rem = 8px
  1rem = 16px
  2rem = 32px
  5rem = 80px
  And so on and so forth...
  

  but there is a trick that a lot of users use The 62.5% Font Size Trick I recommend you to search about it

  This trick is about setting the root default size to 62.5%. It's 62.5% of the default (16px) that is equal to 10px. They set then inside the html {}, like this:

  html {
        font-size: 62.5%;
  }
  

  That's how you set it Well, this bring us a lot of benefits, and i personally like to use it This helps us setting responsive fonts on the screen, since not all browsers uses the same font-size by default, and some users grow up the font to better see then, you could say that it brings us a help with the accessibility, actually this is a rem property, but you simplify the use with this 62.5% trick

  Anyway, when you set the 62.5%, this is the way you would use the rem:

  .5rem = 5px
  1rem = 10px
  2rem = 20px
  5rem = 50px
  And so on and so forth...
  

  Cool, right? You can clearly see how much px the rem will give That's a life savier Well, that's not all, this is the main idea about the trick But i recommend you to search about it, there is a lot about

  12

  Marked as helpful