my responsive media query doesn't work in CSS code?

Question

I am using media queries to change my website look at different sizes...

this is my HTML code

    <meta name="viewport" content="width=device-width, initial- 
       scale=1">
   <link rel="stylesheet" media="screen and (max-width: 600px)" 
       href="styles/style.css"/>

AND my CSS code

 @media screen and (max-widht: 650px) {
       .projects-grid{
           float: none;
           width: 100%;
           grid-template-columns: 100%;
         }
      }

Answer 1

 @media screen and (max-width: 650px) {
       .projects-grid{
           float: none;
           width: 100%;
           grid-template-columns: 100%;
         }
      }

you have a typo in your media query you wrote widht instead of width