object-position-png-001.xhtml

Enable keyboard shortcuts

<?xml version="1.0"?>

<!--

     Any copyright is dedicated to the Public Domain.

     http://creativecommons.org/publicdomain/zero/1.0/

-->

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

  <style xmlns="http://www.w3.org/1999/xhtml"><![CDATA[

      window { padding: 8px; }

      image {

        background: lightgray;

        margin-right: 2px;

        object-fit: contain;

        width: 20px;

        height: 20px;

      .op_y-7  { object-position: 50%  -7% }

      .op_y13  { object-position: 50%  13% }

      .op_y23  { object-position: 50%  23% }

      .op_y50  { object-position: 50%  50% }

      .op_y75  { object-position: 50%  75% }

      .op_y88  { object-position: 50%  88% }

      .op_y111 { object-position: 50% 111% }

  ]]></style>

  <hbox>

    <image src="colors-16x8.png" class="op_y-7"/>

    <image src="colors-16x8.png" class="op_y13"/>

    <image src="colors-16x8.png" class="op_y23"/>

    <image src="colors-16x8.png" class="op_y50"/>

    <image src="colors-16x8.png" class="op_y75"/>

    <image src="colors-16x8.png" class="op_y88"/>

    <image src="colors-16x8.png" class="op_y111"/>

  </hbox>

</window>