Responsive Layouts with Media Queries

Media queries let you adjust layouts based on screen size.

Example:

@media (max-width: 768px) {
  .grid {
grid-template-columns: 1fr;
  }
}

Practice Task:
Make your 3-column gallery responsive so that on mobile screens it becomes 1 column.