Skip to content
Submitted about 2 years ago

Web page using Html, Css, Javascript

Sudip Khatri•540
@SudipKhatri036
A solution to the News homepage challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

I find managing the web page for different screen size difficult but i think i did my best for that and it helped me to understand media query and best practice for resopnsive website and i'm going to improve more in other challenges

Code

Please log in to post a comment

Log in with GitHub

Community feedback

  • Toluwalase•160
    @Tolux001

    Hello. An idea on how to make your image responsive on different devices

     <picture> 
  <source 
    srcset="name of image"
    media="(min-width: screen size )"
  />
   
  <source 
    srcset="name of image"
    media="(min-width: screen size)"
  />
  
**Default if your picture media query doesn't work**
  <img 
    src="" 
    alt=""
  />

</picture>

    For other responsiveness, you need to take note of important break point. Mobile S -320px. Mobile M -375px.

    Mobile L - 425px --> Tablet - 768px Most important to me for mobile devices

    Marked as helpful

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord