News homepage

Community feedback

• 

  Adriano•38,390

  @AdrianoEscarabotePosted about 2 years ago

  Hi BlunderBarry, how are you? I really liked the result of your project, but I have some tips that I think you will enjoy:

  You have used <br> , using <br> is not only bad practice, it is problematic for people who navigate with the aid of screen reading technology. Screen readers can announce the presence of the element. This can be a confusing and frustrating experience for the person using the screen reader. You can read more in MDN.

  The most recommended practice to do a line break in an element is using max-width!

  <div class="read-more">read more</div>

  This should be an a tag, as when the user clicked on it they would likely go to another page to read more!

  The rest is great!

  I hope it helps... 👍

  Marked as helpful

  0
• 

  lissajous-laser•320

  @lissajous-laserPosted about 2 years ago

  I've found that an important pattern to use when making a website responsive is making sure the content is horizontally centered. For instance, when you change the width of this very page, the content remains centered. One way to achieve this is to wrap your content in a div:

  <div>
    <main>
      {...}
    </main>
  </div>
  

  Then apply the following CSS property:

  main {
    margin: 0 auto;
  }
  

  This sets the left and right margins to auto, making it centered. Then in the main selector add width as a relative value (eg %), and max-width as an absolute unit .

  You don't need JS for this project because all the content is the right order to fit the desktop and mobile solutions.

  Let me know if this helped.

  Marked as helpful

  0