<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>Container queries + grid & flexbox</title>
  <link rel="stylesheet" href="../css/skelet.css">

    <style>


    </style>

</head>
<body>


<style>
.cards > * {
    container: card / inline-size;
}

@container (max-width: 450px) {
    .cards > * > * {
        --grid-tc: repeat(1, minmax(0,1fr))!important
    }
}
</style>



<div id="app">

    <header span="row" >
        <h1 class="text-c