tor-browser

The Tor Browser
git clone https://git.dasho.dev/tor-browser.git
Log | Files | Refs | README | LICENSE

object-view-box-fit-contain-template.html (1193B)

      1 <!DOCTYPE html>
      2 <html>
      3 <title>CSS object-view-box with object-fit:contain</title>
      4 <link rel="author" href="mailto:khushalsagar@chromium.org">
      5 <link rel="match" href="object-view-box-fit-contain-__NAME__-ref.html">
      6 <script src="support/testHelper.js"></script>
      7 <link rel="help" href="https://drafts.csswg.org/css-images-4/#the-object-view-box">
      8 
      9 <body>
     10 <style>
     11 .view_box_subset {
     12  object-view-box: inset(50px 0px 0px 0px);
     13  object-fit: contain;
     14  width: 50px;
     15  height: 100px;
     16  background-color: grey;
     17  margin: 5px;
     18 }
     19 
     20 .view_box_subset_with_position {
     21  object-view-box: inset(50px 0px 0px 0px);
     22  object-fit: contain;
     23  width: 50px;
     24  height: 100px;
     25  background-color: grey;
     26  margin: 5px;
     27 
     28  object-position: 0% 0%;
     29  background-color: grey;
     30 }
     31 
     32 .view_box_subset_with_scaling {
     33  object-view-box: inset(50px 0px 0px 0px);
     34  object-fit: contain;
     35  background-color: grey;
     36  margin: 5px;
     37 
     38  width: 100px;
     39  height: 200px;
     40  object-position: 25px 125px;
     41 }
     42 </style>
     43 <__TAG__ class="view_box_subset"></__TAG__>
     44 <__TAG__ class="view_box_subset_with_position"></__TAG__>
     45 <__TAG__ class="view_box_subset_with_scaling"></__TAG__>
     46 </body>
     47 <script>
     48  populateElements("__IMAGE_SOURCE__");
     49 </script>