Personal Portfolio-FCC

1

https://codepen.io/Heisenberg012/pen/abdbwJq?editors=1100I am trying to make my projects section responsive that when screen is 940px or below, the project section has 1 column and 4 rows so that each projects takes up 1 row. check my code to see the problem.
TIA

@media only screen and (max-width: 940px) {
*{
  box-sizing:border-box;
  list-style:none;
  margin:0 0;
  text-decoration:none;
  
}

  .container{
    display:flex;
    grid-template-columns:400px;
    grid-template-rows:auto auto auto auto;
    
  }
}
2

Why use the Flexbox layout for the container and then use the CSS properties of the Grid layout ?

Uses one or the other but does not mix the two. :grinning:

1 Like
3

must have wrote flex instead of grid by mistake. thanks alot