Responsive news homepage using CSS Flexbox, Grid and basic JavaScript

Community feedback

• 

  Amal Karim ✅•1,290

  @amalkarimPosted almost 2 years ago

  Hi Eduardo. Great solution!

  I'm just curious as why you chose to use vh unit to define font-size, like for example font-size: 2.6vh;. When I visit your page using mobile view, the text is too small to read. I think it's better to define font-size in html using px, and then define it in other element using rem. For example:

  html {
      font-size: 16px;
  }
  h1 {
      font-size: 2rem;
  }
  footer {
      font-size: 0.8rem;
  }
  

  Let me know what you think.

  1

  ---

  

  Eduardo Falarz•80

  @ETUUUPosted almost 2 years ago

  @amalkarim Hey, thanks for the comment!

  Well, I got your point. I indeed tried to use px, em and rem for the font sizes and it worked well, but only when the page was static. Whenever I tried to use the google dev tools to view what the page would look like on a cellphone, the written content was weird and small most of the times.

  I saw some people on StackOverflow forums saying that using vh, vmin and other measures like this could bring better results, so I tested and it seemed to work properly.

  I will take some time to give another look at the code and improve this :)

  0

  

  Amal Karim ✅•1,290

  @amalkarimPosted almost 2 years ago

  @ETUUU

  Really? Thanks! This is news to me. Usually, when I use px or rem, the text would look nice whether in desktop or mobile view. But now I know there's actually another method to define the size unit of the text that could work nicely even though it sounds weird at first. It's nice to know that! 😃

  1