media queries

2023.01.09
media queries
#css
use client /components/post/reExport media queries 2023.01.09 ],
  imgUrl:  ,
  desc:  ,
  body: (
    <>
      <H>Container queries</H>

      <ul>
        <li>
          <Lnk path= >
            Container queries
          </Lnk>{ }
          is the same as media queries, but not based on the view port, but any element
        </li>
        <li>
          <code>@container</code> styles will be applied to elements based on the size of the
          nearest parent with <code>container-type</code>
        </li>
      </ul>

      <ComponentFromHtmlString
        htmlString={ >
                <h2>i am fat when parent width > 700px</h2>
              </div>
            </body>
          </html>
         }
          <code>container-name</code>
        </li>
      </ul>

      <ComponentFromHtmlString
        htmlString={ >
                parent-1
                <div class= >
                  parent-2
                  <div class= >
                    resize paper to see how I can change color
                  </div>
                </div>
              </div>
            </body>
          </html>
        