news blog page

Community feedback

• 

  P

  Lo-Deck•2,650

  @Lo-DeckPosted about 1 month ago

  Hi well done for this challenge,

  I'll give you this link you check out the mistake for HTML and CSS. 3WC validator.

  You used too much div use more semantic tag like section, article...

  <div class="main-image"> 
     <img src="image-web-3-desktop.jpg" alt="web3 pic" class="source"> 
     <img src="image-web-3-mobile.jpg" alt="web3 image" class="img">             
  </div> 
  

  You can use picture tag to display different image depending on the size. Here a link : MDN.

  <picture>
    <source media="(max-width: 799px)" srcset="your path" >
    <source media="(min-width: 800px)" srcset="your path" >
    <img src="your path" alt="your description" >
  </picture>
  

  Wrap this in a ul with li :

  <a href="#home">Home</a>
  <a href="#new">New</a>
  <a href="#popular">Popular</a>
  <a href="#trending">Trending</a>
  <a href="#categories">Categories</a>
  

  It's better to use em or rem instead of px. FreeCodeCamp. FreeCodeCamp.

  It's easier to start with a mobile-approach FreeCodeCamp.

  And with a big screen your element are not correctly set. Try with the web tool, above 2200px your element are over each other.

  Hope to be helpful.

  0