Run ❯
zig
.
com
×
Change Orientation
Change Theme, Dark/Light
Go to Spaces
<!DOCTYPE html> <html> <head> <style> .parent { container-name: myContainer; container-type: inline-size; } /* Add styles if myContainer is less than 500px wide */ @container myContainer (width < 500px) { .child { width: 50%; border: 2px solid maroon; background-color: salmon; } } </style> </head> <body> <h1>Demo of @container</h1> <p>Resize the page to see the effect.</p> <div class="parent"> <div class="child"> <h2>A header</h2> <p>Some text.</p> </div> </div> </body> <!-- /cssref/tryit.php?filename=trycss_atrule_container by HTTrack Website Copier/3.x [XR&CO'2014], Thu, 06 Feb 2025 18:31:05 GMT --> </html>
