<div class="component">
    <div class="component-box">
      Component
    </div>
  </div>
.component {
  container-type: inline-size;
}
.component-box {
  color: #333;
  padding: 1em;
  font-size: 2rem;
}

@container (max-width: 480px) {
  .component-box {
    color: #fff;
    background: #f44;
    font-weight: 700;
  }
}
Run Pen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.