<chapter>
  <title>GTK CSS Properties</title>
  <para>
    GTK supports CSS properties and shorthands as far as they can be
    applied in the context of widgets, and adds its own properties only
    when needed. All GTK-specific properties have a -gtk prefix.
  </para>
  <sect1>
    <title>Basic types</title>
    <para>
      All properties support the following keywords: inherit, initial,
      unset, with the same meaning as defined in the
      <ulink url="https://www.w3.org/TR/css3-cascade/#defaulting-keywords">CSS
      Cascading and Inheritance</ulink> spec.
    </para>
    <para>
      The following units are supported for basic datatypes:
    </para>
    <variablelist spacing="compact">
      <varlistentry>
        <term>
          Length
        </term>
        <listitem>
          <para>
            px, pt, em, ex, rem, pc, in, cm, mm, <link linkend="calc"><function>calc()</function></link>
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          Percentage
        </term>
        <listitem>
          <para>
            %, <link linkend="calc"><function>calc()</function></link>
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          Angle
        </term>
        <listitem>
          <para>
            deg, grad, turn, <link linkend="calc"><function>calc()</function></link>
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          Time
        </term>
        <listitem>
          <para>
            s, ms, <link linkend="calc"><function>calc()</function></link>
          </para>
        </listitem>
      </varlistentry>
    </variablelist>
    <para>
      Length values with the em or ex units are resolved using the font
      size value, unless they occur in setting the font-size itself, in
      which case they are resolved using the inherited font size value.
    </para>
    <para>
      The rem unit is resolved using the initial font size value, which
      is not quite the same as the CSS definition of rem.
    </para>
    <para>
      The <link linkend="calc"><function>calc()</function></link> notation adds considerable expressive power. There are
      limits on what types can be combined in such an expression
      (e.g. it does not make sense to add a number and a time). For the
      full details, see the
      <ulink url="https://www.w3.org/TR/css3-values/#calc-notation">CSS3
      Values and Units</ulink> spec.
    </para>
    <para>
      A common pattern among shorthand properties (called <quote>four
      sides</quote>) is one where one to four values can be specified,
      to determine a value for each side of an area. In this case, the
      specified values are interpreted as follows:
    </para>
    <variablelist spacing="compact">
      <varlistentry>
        <term>
          4 values:
        </term>
        <listitem>
          <para>
            top right bottom left
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          3 values:
        </term>
        <listitem>
          <para>
            top horizontal bottom
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          2 values:
        </term>
        <listitem>
          <para>
            vertical horizontal
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          1 value:
        </term>
        <listitem>
          <para>
            all
          </para>
        </listitem>
      </varlistentry>
    </variablelist>
  </sect1>
  <sect1>
    <title>Colors</title>
    <para>
      GTK extends the CSS syntax with several additional ways to specify
      colors.
    </para>
    <para>
      The first is a reference to a color defined via a <parameter>define</parameter>-color
      rule in CSS. The syntax for <parameter>define</parameter>-color rules is as follows:
    </para>
    <programlisting>
<parameter>define</parameter>-color Name Color
</programlisting>
    <para>
      To refer to the color defined by a <parameter>define</parameter>-color rule, prefix the
      name with @.
    </para>
    <para>
      GTK also supports color expressions, which allow colors to be
      transformed to new ones. Color expressions can be nested,
      providing a rich language to define colors. Color expressions
      resemble functions, taking 1 or more colors and in some cases a
      number as arguments.
    </para>
    <variablelist spacing="compact">
      <varlistentry>
        <term>
          <literal>lighter(Color)</literal>
        </term>
        <listitem>
          <para>
            produces a brigher variant of Color
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          <literal>darker(Color)</literal>
        </term>
        <listitem>
          <para>
            produces a darker variant of Color
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          <literal>shade(Color, Number)</literal>
        </term>
        <listitem>
          <para>
            changes the lightness of Color. The number ranges from 0 for
            black to 2 for white.
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          <literal>alpha(Color, Number)</literal>
        </term>
        <listitem>
          <para>
            replaces the alpha value of color with number (between 0 and
            1)
          </para>
        </listitem>
      </varlistentry>
      <varlistentry>
        <term>
          <literal>mix(Color1, Color2, Number)</literal>
        </term>
        <listitem>
          <para>
            interpolates between the two colors
          </para>
        </listitem>
      </varlistentry>
    </variablelist>
  </sect1>
  <sect1>
    <title>Images</title>
    <para>
      GTK extends the CSS syntax for images and also uses it for
      specifying icons. To load a themed icon, use
    </para>
    <programlisting>
-gtk-icontheme(Name)
</programlisting>
    <para>
      The specified icon name is used to look up a themed icon, while
      taking into account the values of the -gtk-icon-palette property.
      This kind of image is mainly used as value of the -gtk-icon-source
      property.
    </para>
    <para>
      Symbolic icons from the icon theme are recolored according to the
      -gtk-icon-palette property, which defines a list of named colors.
      The recognized names for colors in symbolic icons are error,
      warning and success. The default palette maps these three names to
      symbolic colors with the names <parameter>error_color</parameter>, <parameter>warning_color</parameter> and
      <parameter>success_color</parameter> respectively. The syntax for defining a custom
      palette is a comma-separated list of name-color pairs, e.g.
    </para>
    <programlisting>
success blue, warning <link linkend="fc3"><type>fc3</type></link>, error magenta
</programlisting>
    <para>
      Recoloring is sometimes needed for images that are not part of an
      icon theme, and the
    </para>
    <programlisting>
-gtk-recolor(uri, palette)
</programlisting>
    <para>
      syntax makes this available. -gtk-recolor requires a url as first
      argument. The remaining arguments specify the color palette to
      use. If the palette is not explicitly specified, the current value
      of the -gtk-icon-palette property is used.
    </para>
    <para>
      GTK supports scaled rendering on hi-resolution displays. This
      works best if images can specify normal and hi-resolution
      variants. From CSS, this can be done with
    </para>
    <programlisting>
-gtk-scaled(Image1, Image2)
</programlisting>
  </sect1>
  <sect1>
    <title>GTK CSS Properties</title>
    <informaltable>
      <tgroup cols="3">
        <colspec colwidth="40*" align="left" />
        <colspec colwidth="36*" align="left" />
        <colspec colwidth="23*" align="left" />
        <thead>
          <row>
            <entry>
              Property
            </entry>
            <entry>
              Reference
            </entry>
            <entry>
              Notes
            </entry>
          </row>
        </thead>
        <tbody>
          <row>
            <entry>
              color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-color/#foreground">CSS
              Color Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              opacity
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-color/#opacity">CSS
              Color Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              filter
            </entry>
            <entry>
              <ulink url="https://drafts.fxtf.org/filters/#FilterProperty">CSS
              Filter Effect Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-family
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-family-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
              defaults to gtk-font-name setting
            </entry>
          </row>
          <row>
            <entry>
              font-size
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-size-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
              defaults to gtk-font-name setting
            </entry>
          </row>
          <row>
            <entry>
              font-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-style-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#descdef-font-variant">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
              only CSS2 values supported
            </entry>
          </row>
          <row>
            <entry>
              font-weight
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-weight-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-stretch
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-stretch-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-kerning
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-kerning-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant-ligatures
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-ligatures-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant-position
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-position-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant-caps
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-position-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant-numeric
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-numeric-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant-alternates
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-alternates-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variant-east-asian
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-east-asian-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-feature-settings
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-feature-settings-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              font-variation-settings
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-fonts-4/#font-variation-settings-def">CSS
              Fonts Level 4</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              -gtk-dpi
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-values/#number-value">Number</ulink>
            </entry>
            <entry>
              defaults to screen resolution
            </entry>
          </row>
          <row>
            <entry>
              font
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
              CSS allows line-height, etc
            </entry>
          </row>
          <row>
            <entry>
              font-variant
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-fonts/#font-variant-prop">CSS
              Fonts Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              caret-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-ui/#caret-color">CSS
              Basic User Interface Level 3</ulink>
            </entry>
            <entry>
              CSS allows an auto value
            </entry>
          </row>
          <row>
            <entry>
              -gtk-secondary-caret-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-color-3/#valuea-def-color">Color</ulink>
            </entry>
            <entry>
              used for the secondary caret in bidirectional text
            </entry>
          </row>
          <row>
            <entry>
              letter-spacing
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-text/#letter-spacing">CSS
              Text Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              text-decoration-line
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-text-decor-3/#text-decoration-line-property">CSS
              Text Decoration Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              text-decoration-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-text-decor-3/#text-decoration-color-property">CSS
              Text Decoration Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              text-decoration-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-text-decor-3/#text-decoration-style-property">CSS
              Text Decoration Level 3</ulink>
            </entry>
            <entry>
              CSS allows dashed and dotted
            </entry>
          </row>
          <row>
            <entry>
              text-shadow
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-text-decor-3/#text-shadow-property">CSS
              Text Decoration Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              text-decoration
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-text-decor-3/#text-decoration-property">CSS
              Text Decoration Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-source
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-backgrounds-3/#typedef-image">Image</ulink>,
              <literal>builtin</literal> or <literal>none</literal>
            </entry>
            <entry>
              used for builtin icons in buttons and expanders
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-size
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-values/#length-value">Length</ulink>
            </entry>
            <entry>
              size used for builtin icons in buttons and expanders
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-style
            </entry>
            <entry>
              <literal>requested</literal>, <literal>regular</literal>
              or <literal>symbolic</literal>
            </entry>
            <entry>
              preferred style for application-loaded icons
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-transform
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-transforms-1/#typedef-transform-list">Transform
              list</ulink> or <literal>none</literal>
            </entry>
            <entry>
              applied to builtin and application-loaded icons
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-palette
            </entry>
            <entry>
              Color palette, as explained above
            </entry>
            <entry>
              used to recolor symbolic icons
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-shadow
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-backgrounds-3/#typedef-shadow">Shadow</ulink>
              or <literal>none</literal>
            </entry>
            <entry>
              applied to builtin and application-loaded icons
            </entry>
          </row>
          <row>
            <entry>
              -gtk-icon-filter
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/filter-effects-1/#typedef-filter-value-list">Filter
              value list</ulink> or <literal>none</literal>
            </entry>
            <entry>
              applied to builtin and application-loaded icons
            </entry>
          </row>
          <row>
            <entry>
              transform
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-transforms-1/#transform-property">CSS
              Transforms Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              transform-origin
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-transforms-1/#transform-origin-property">CSS
              Transforms Level 1</ulink>
            </entry>
            <entry>
              CSS allows specifying a z component
            </entry>
          </row>
          <row>
            <entry>
              min-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#min-width">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages
            </entry>
          </row>
          <row>
            <entry>
              min-height
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#min-height">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages
            </entry>
          </row>
          <row>
            <entry>
              margin-top
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#margin-top">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages or auto
            </entry>
          </row>
          <row>
            <entry>
              margin-right
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#margin-right">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages or auto
            </entry>
          </row>
          <row>
            <entry>
              margin-bottom
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#margin-bottom">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages or auto
            </entry>
          </row>
          <row>
            <entry>
              margin-left
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#margin-left">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages or auto
            </entry>
          </row>
          <row>
            <entry>
              padding-top
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#padding-top">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages
            </entry>
          </row>
          <row>
            <entry>
              padding-right
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#padding-right">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages
            </entry>
          </row>
          <row>
            <entry>
              padding-bottom
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#padding-bottom">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages
            </entry>
          </row>
          <row>
            <entry>
              padding-left
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#padding-left">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              CSS allows percentages
            </entry>
          </row>
          <row>
            <entry>
              margin
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#margin">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              padding
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-box/#padding">CSS
              Box Model Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              border-top-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-width">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              CSS allows other values
            </entry>
          </row>
          <row>
            <entry>
              border-right-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-width">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              CSS allows other values
            </entry>
          </row>
          <row>
            <entry>
              border-bottom-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-width">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              CSS allows other values
            </entry>
          </row>
          <row>
            <entry>
              border-left-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-width">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              CSS allows other values
            </entry>
          </row>
          <row>
            <entry>
              border-top-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-style">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-right-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-style">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-bottom-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-style">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-left-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-style">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-top-right-radius
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-radius">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-bottom-right-radius
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-radius">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-bottom-left-radius
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-radius">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-top-left-radius
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-radius">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-top-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-color">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-right-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-color">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-bottom-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-color">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-left-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-color">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-image-source
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-image-source">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-image-repeat
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-image-repeat">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-image-slice
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-image-slice">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              border-image-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-image-width">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              border-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-width">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              border-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#the-border-style">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              border-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-color">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              a <quote>four sides</quote> property
            </entry>
          </row>
          <row>
            <entry>
              border-top
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-top">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-right
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-right">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-bottom
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-bottom">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-left
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-left">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-radius
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-radius">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-image
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#border-image">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              outline-style
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-ui/#outline-style">CSS
              Basic User Interface Level 3</ulink>
            </entry>
            <entry>
              initial value is none, auto is not supported
            </entry>
          </row>
          <row>
            <entry>
              outline-width
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-ui/#outline-width">CSS
              Basic User Interface Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              outline-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-ui/#outline-color">CSS
              Basic User Interface Level 3</ulink>
            </entry>
            <entry>
              initial value is currentColor, invert is not supported
            </entry>
          </row>
          <row>
            <entry>
              outline-offset
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-ui/#outline-offset">CSS
              Basic User Interface Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              outline
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-ui/#propdef-outline">CSS
              Basic User Interface Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-color
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-color">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-clip
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-clip">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-origin
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-origin">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-size
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-size">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-position
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-position">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-repeat
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-repeat">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-image
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background-image">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
              not supported: urls without quotes
            </entry>
          </row>
          <row>
            <entry>
              box-shadow
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#box-shadow">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              background-blend-mode
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/compositing-1/#propdef-background-blend-mode">CSS
              Compositing and Blending Level 1</ulink>
            </entry>
            <entry>
              only affects multiple backgrounds
            </entry>
          </row>
          <row>
            <entry>
              background
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-background/#background">CSS
              Backgrounds and Borders Level 3</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              transition-property
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-transitions/#transition-property">CSS
              Transitions</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              transition-duration
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-transitions/#transition-duration">CSS
              Transitions</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              transition-timing-function
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-transitions/#transition-timing-function">CSS
              Transitions</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              transition-delay
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-transitions/#transition-delay">CSS
              Transitions</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              transition
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-transitions/#transition">CSS
              Transitions</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-name
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-name">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-duration
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-duration">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-timing-function
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-timing-function">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-iteration-count
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-iteration-count">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-direction
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-direction">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-play-state
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-play-state">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-delay
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-delay">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation-fill-mode
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation-fill-mode">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              animation
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css3-animations/#animation">CSS
              Animations Level 1</ulink>
            </entry>
            <entry>
            </entry>
          </row>
          <row>
            <entry>
              border-spacing
            </entry>
            <entry>
              <ulink url="https://www.w3.org/TR/css-tables-3/#border-spacing-property">CSS
              Table Level 3</ulink>
            </entry>
            <entry>
              respected by GtkBoxLayout, GtkGridLayout, GtkCenterLayout
            </entry>
          </row>
        </tbody>
      </tgroup>
    </informaltable>
  </sect1>
</chapter>
