Container queries

Pasos para aplicar un container query

by InaWeb

HTML

<div class="container">
  <ul>
   <li>Inicio</li>
   <li>Sobre Nosostros</li>
   <li>Contactenos</li>
  </ul>
</div>

CSS

.container { 
  container-type: inline-size;
  container-name: navbar; 
}
ul{
  list-style:none;
  
}

@container navbar (min-width: 500px) {
 ul {
   display: flex;
   background-color:pink;
 } 
}