From 6bf0a5cb5034a7e684dcc3500e841785237ce2dd Mon Sep 17 00:00:00 2001
From: Daniel Baumann <daniel.baumann@progress-linux.org>
Date: Sun, 7 Apr 2024 19:32:43 +0200
Subject: Adding upstream version 1:115.7.0.

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
---
 .../diagonal-percentage-vector-background-ref.html |  31 ++++
 .../diagonal-percentage-vector-background.html     |  31 ++++
 .../backgrounds/vector/diagonal-scaled-fixed.svg   |  10 +
 .../backgrounds/vector/diagonal-scaled.svg         |  21 +++
 .../vector/empty/intrinsic-ratio-no-dimensions.svg |  10 +
 .../vector/empty/intrinsic-ratio-zero-height.svg   |  11 ++
 .../vector/empty/intrinsic-ratio-zero-width.svg    |  11 ++
 ...ercent-width-omitted-height-extreme-viewbox.svg |  11 ++
 ...ted-width-nonpercent-height-extreme-viewbox.svg |  11 ++
 .../backgrounds/vector/empty/ref-tall-empty.html   |  24 +++
 .../backgrounds/vector/empty/ref-tall-lime.html    |  28 +++
 .../backgrounds/vector/empty/ref-wide-empty.html   |  21 +++
 .../backgrounds/vector/empty/ref-wide-lime.html    |  28 +++
 .../reftests/backgrounds/vector/empty/reftest.list |  26 +++
 .../vector/empty/tall--contain--height.html        |  35 ++++
 .../vector/empty/tall--contain--width.html         |  35 ++++
 .../vector/empty/tall--cover--height.html          |  35 ++++
 .../vector/empty/tall--cover--width.html           |  35 ++++
 .../vector/empty/wide--contain--height.html        |  35 ++++
 .../vector/empty/wide--contain--width.html         |  35 ++++
 .../vector/empty/wide--cover--height.html          |  35 ++++
 .../vector/empty/wide--cover--width.html           |  35 ++++
 .../vector/empty/zero-height-ratio-5px-auto.html   |  34 ++++
 .../vector/empty/zero-height-ratio-auto-5px.html   |  34 ++++
 .../vector/empty/zero-height-ratio-auto-auto.html  |  34 ++++
 .../vector/empty/zero-height-ratio-contain.html    |  34 ++++
 .../vector/empty/zero-height-ratio-cover.html      |  34 ++++
 .../empty/zero-ratio-no-dimensions-5px-auto.html   |  34 ++++
 .../empty/zero-ratio-no-dimensions-auto-5px.html   |  34 ++++
 .../empty/zero-ratio-no-dimensions-auto-auto.html  |  34 ++++
 .../empty/zero-ratio-no-dimensions-contain.html    |  34 ++++
 .../empty/zero-ratio-no-dimensions-cover.html      |  34 ++++
 .../vector/empty/zero-width-ratio-5px-auto.html    |  34 ++++
 .../vector/empty/zero-width-ratio-auto-5px.html    |  34 ++++
 .../vector/empty/zero-width-ratio-auto-auto.html   |  34 ++++
 .../vector/empty/zero-width-ratio-contain.html     |  34 ++++
 .../vector/empty/zero-width-ratio-cover.html       |  34 ++++
 .../backgrounds/vector/no-aspect-ratio-normal.html |  28 +++
 .../backgrounds/vector/no-aspect-ratio-wide.html   |  28 +++
 .../nonpercent-width-nonpercent-height-viewbox.svg |  12 ++
 .../vector/nonpercent-width-nonpercent-height.svg  |  10 +
 .../nonpercent-width-omitted-height-viewbox.svg    |  12 ++
 .../vector/nonpercent-width-omitted-height.svg     |  10 +
 .../nonpercent-width-percent-height-viewbox.svg    |  12 ++
 .../vector/nonpercent-width-percent-height.svg     |  10 +
 .../omitted-width-nonpercent-height-viewbox.svg    |  12 ++
 .../vector/omitted-width-nonpercent-height.svg     |  10 +
 ...ed-width-omitted-height-viewbox-no-preserve.svg |  10 +
 .../omitted-width-omitted-height-viewbox.svg       |  11 ++
 .../vector/omitted-width-omitted-height.svg        |   9 +
 .../omitted-width-percent-height-viewbox.svg       |  12 ++
 .../vector/omitted-width-percent-height.svg        |  10 +
 .../percent-width-nonpercent-height-viewbox.svg    |  12 ++
 .../vector/percent-width-nonpercent-height.svg     |  10 +
 .../percent-width-omitted-height-viewbox.svg       |  12 ++
 .../vector/percent-width-omitted-height.svg        |  10 +
 .../percent-width-percent-height-viewbox.svg       |  12 ++
 .../vector/percent-width-percent-height.svg        |  10 +
 .../vector/ref-tall-lime192x384-aqua192x384.html   |  31 ++++
 .../vector/ref-tall-lime256x16-aqua256x16.html     |  31 ++++
 .../vector/ref-tall-lime256x384-aqua256x384.html   |  31 ++++
 .../vector/ref-tall-lime256x512-aqua256x256.html   |  31 ++++
 .../backgrounds/vector/ref-tall-lime256x768.html   |  22 +++
 .../vector/ref-tall-lime2x16-aqua2x16.html         |  31 ++++
 .../vector/ref-tall-lime32x128-aqua32x128.html     |  31 ++++
 .../vector/ref-tall-lime32x16-aqua32x16.html       |  31 ++++
 .../vector/ref-tall-lime32x256-aqua32x256.html     |  31 ++++
 .../vector/ref-tall-lime32x384-aqua32x384.html     |  31 ++++
 .../vector/ref-tall-lime32x64-aqua32x64.html       |  31 ++++
 .../vector/ref-tall-lime48x384-aqua48x384.html     |  31 ++++
 .../vector/ref-tall-lime4x16-aqua4x16.html         |  31 ++++
 .../vector/ref-tall-lime8x16-aqua8x16.html         |  31 ++++
 .../vector/ref-tall-lime8x32-aqua8x32.html         |  31 ++++
 .../vector/ref-tall-lime8x384-aqua8x384.html       |  31 ++++
 .../vector/ref-tall-lime8x64-aqua8x64.html         |  31 ++++
 .../vector/ref-wide-lime12x128-aqua12x128.html     |  31 ++++
 .../vector/ref-wide-lime12x16-aqua12x16.html       |  31 ++++
 .../vector/ref-wide-lime12x24-aqua12x24.html       |  31 ++++
 .../vector/ref-wide-lime12x96-aqua12x96.html       |  31 ++++
 .../vector/ref-wide-lime16x128-aqua16x128.html     |  31 ++++
 .../vector/ref-wide-lime2x16-aqua2x16.html         |  31 ++++
 .../vector/ref-wide-lime64x128-aqua64x128.html     |  31 ++++
 .../vector/ref-wide-lime768x128-aqua768x128.html   |  31 ++++
 .../vector/ref-wide-lime768x16-aqua768x16.html     |  31 ++++
 .../backgrounds/vector/ref-wide-lime768x256.html   |  29 +++
 .../vector/ref-wide-lime8x128-aqua8x128.html       |  31 ++++
 .../vector/ref-wide-lime8x16-aqua8x16.html         |  31 ++++
 .../vector/ref-wide-lime8x64-aqua8x64.html         |  31 ++++
 layout/reftests/backgrounds/vector/reftest.list    | 204 +++++++++++++++++++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...x-auto--nonpercent-width-nonpercent-height.html |  34 ++++
 ...o--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...32px-auto--nonpercent-width-omitted-height.html |  34 ++++
 ...o--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...32px-auto--nonpercent-width-percent-height.html |  34 ++++
 ...o--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...32px-auto--omitted-width-nonpercent-height.html |  34 ++++
 ...auto--omitted-width-omitted-height-viewbox.html |  35 ++++
 ...l--32px-auto--omitted-width-omitted-height.html |  34 ++++
 ...auto--omitted-width-percent-height-viewbox.html |  35 ++++
 ...l--32px-auto--omitted-width-percent-height.html |  34 ++++
 ...o--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...32px-auto--percent-width-nonpercent-height.html |  34 ++++
 ...auto--percent-width-omitted-height-viewbox.html |  35 ++++
 ...l--32px-auto--percent-width-omitted-height.html |  34 ++++
 ...auto--percent-width-percent-height-viewbox.html |  35 ++++
 ...l--32px-auto--percent-width-percent-height.html |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...--auto--nonpercent-width-nonpercent-height.html |  34 ++++
 ...o--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...all--auto--nonpercent-width-omitted-height.html |  34 ++++
 ...o--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...all--auto--nonpercent-width-percent-height.html |  34 ++++
 ...o--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...all--auto--omitted-width-nonpercent-height.html |  34 ++++
 ...auto--omitted-width-omitted-height-viewbox.html |  35 ++++
 .../tall--auto--omitted-width-omitted-height.html  |  34 ++++
 ...auto--omitted-width-percent-height-viewbox.html |  35 ++++
 .../tall--auto--omitted-width-percent-height.html  |  34 ++++
 ...o--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...all--auto--percent-width-nonpercent-height.html |  34 ++++
 ...auto--percent-width-omitted-height-viewbox.html |  35 ++++
 .../tall--auto--percent-width-omitted-height.html  |  34 ++++
 ...auto--percent-width-percent-height-viewbox.html |  35 ++++
 .../tall--auto--percent-width-percent-height.html  |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...o-32px--nonpercent-width-nonpercent-height.html |  34 ++++
 ...x--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...auto-32px--nonpercent-width-omitted-height.html |  34 ++++
 ...x--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...auto-32px--nonpercent-width-percent-height.html |  34 ++++
 ...x--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...auto-32px--omitted-width-nonpercent-height.html |  34 ++++
 ...32px--omitted-width-omitted-height-viewbox.html |  35 ++++
 ...l--auto-32px--omitted-width-omitted-height.html |  34 ++++
 ...32px--omitted-width-percent-height-viewbox.html |  35 ++++
 ...l--auto-32px--omitted-width-percent-height.html |  34 ++++
 ...x--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...auto-32px--percent-width-nonpercent-height.html |  34 ++++
 ...32px--percent-width-omitted-height-viewbox.html |  35 ++++
 ...l--auto-32px--percent-width-omitted-height.html |  34 ++++
 ...32px--percent-width-percent-height-viewbox.html |  35 ++++
 ...l--auto-32px--percent-width-percent-height.html |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...ontain--nonpercent-width-nonpercent-height.html |  34 ++++
 ...n--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...--contain--nonpercent-width-omitted-height.html |  34 ++++
 ...n--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...--contain--nonpercent-width-percent-height.html |  34 ++++
 ...n--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...--contain--omitted-width-nonpercent-height.html |  34 ++++
 ...tain--omitted-width-omitted-height-viewbox.html |  35 ++++
 ...all--contain--omitted-width-omitted-height.html |  34 ++++
 ...tain--omitted-width-percent-height-viewbox.html |  35 ++++
 ...all--contain--omitted-width-percent-height.html |  34 ++++
 ...n--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...--contain--percent-width-nonpercent-height.html |  34 ++++
 ...tain--percent-width-omitted-height-viewbox.html |  35 ++++
 ...all--contain--percent-width-omitted-height.html |  34 ++++
 ...tain--percent-width-percent-height-viewbox.html |  35 ++++
 ...all--contain--percent-width-percent-height.html |  34 ++++
 ...-nonpercent-width-nonpercent-height--crisp.html |  35 ++++
 ...ent-width-nonpercent-height-viewbox--crisp.html |  36 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  36 ++++
 ...-cover--nonpercent-width-nonpercent-height.html |  35 ++++
 ...r--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...ll--cover--nonpercent-width-omitted-height.html |  34 ++++
 ...r--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...ll--cover--nonpercent-width-percent-height.html |  34 ++++
 ...r--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...ll--cover--omitted-width-nonpercent-height.html |  34 ++++
 ...over--omitted-width-omitted-height-viewbox.html |  35 ++++
 .../tall--cover--omitted-width-omitted-height.html |  34 ++++
 ...over--omitted-width-percent-height-viewbox.html |  35 ++++
 .../tall--cover--omitted-width-percent-height.html |  34 ++++
 ...r--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...ll--cover--percent-width-nonpercent-height.html |  34 ++++
 ...over--percent-width-omitted-height-viewbox.html |  35 ++++
 .../tall--cover--percent-width-omitted-height.html |  34 ++++
 ...over--percent-width-percent-height-viewbox.html |  35 ++++
 .../tall--cover--percent-width-percent-height.html |  34 ++++
 layout/reftests/backgrounds/vector/template.html   |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...x-auto--nonpercent-width-nonpercent-height.html |  34 ++++
 ...o--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...12px-auto--nonpercent-width-omitted-height.html |  34 ++++
 ...o--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...12px-auto--nonpercent-width-percent-height.html |  34 ++++
 ...o--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...12px-auto--omitted-width-nonpercent-height.html |  34 ++++
 ...auto--omitted-width-omitted-height-viewbox.html |  35 ++++
 ...e--12px-auto--omitted-width-omitted-height.html |  34 ++++
 ...auto--omitted-width-percent-height-viewbox.html |  35 ++++
 ...e--12px-auto--omitted-width-percent-height.html |  34 ++++
 ...o--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...12px-auto--percent-width-nonpercent-height.html |  34 ++++
 ...auto--percent-width-omitted-height-viewbox.html |  35 ++++
 ...e--12px-auto--percent-width-omitted-height.html |  34 ++++
 ...auto--percent-width-percent-height-viewbox.html |  35 ++++
 ...e--12px-auto--percent-width-percent-height.html |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...--auto--nonpercent-width-nonpercent-height.html |  34 ++++
 ...o--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...ide--auto--nonpercent-width-omitted-height.html |  34 ++++
 ...o--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...ide--auto--nonpercent-width-percent-height.html |  34 ++++
 ...o--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...ide--auto--omitted-width-nonpercent-height.html |  34 ++++
 ...auto--omitted-width-omitted-height-viewbox.html |  35 ++++
 .../wide--auto--omitted-width-omitted-height.html  |  34 ++++
 ...auto--omitted-width-percent-height-viewbox.html |  35 ++++
 .../wide--auto--omitted-width-percent-height.html  |  34 ++++
 ...o--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...ide--auto--percent-width-nonpercent-height.html |  34 ++++
 ...auto--percent-width-omitted-height-viewbox.html |  35 ++++
 .../wide--auto--percent-width-omitted-height.html  |  34 ++++
 ...auto--percent-width-percent-height-viewbox.html |  35 ++++
 .../wide--auto--percent-width-percent-height.html  |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...o-32px--nonpercent-width-nonpercent-height.html |  34 ++++
 ...x--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...auto-32px--nonpercent-width-omitted-height.html |  34 ++++
 ...x--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...auto-32px--nonpercent-width-percent-height.html |  34 ++++
 ...x--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...auto-32px--omitted-width-nonpercent-height.html |  34 ++++
 ...32px--omitted-width-omitted-height-viewbox.html |  35 ++++
 ...e--auto-32px--omitted-width-omitted-height.html |  34 ++++
 ...32px--omitted-width-percent-height-viewbox.html |  35 ++++
 ...e--auto-32px--omitted-width-percent-height.html |  34 ++++
 ...x--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...auto-32px--percent-width-nonpercent-height.html |  34 ++++
 ...32px--percent-width-omitted-height-viewbox.html |  35 ++++
 ...e--auto-32px--percent-width-omitted-height.html |  34 ++++
 ...32px--percent-width-percent-height-viewbox.html |  35 ++++
 ...e--auto-32px--percent-width-percent-height.html |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...ontain--nonpercent-width-nonpercent-height.html |  34 ++++
 ...n--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...--contain--nonpercent-width-omitted-height.html |  34 ++++
 ...n--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...--contain--nonpercent-width-percent-height.html |  34 ++++
 ...n--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...--contain--omitted-width-nonpercent-height.html |  34 ++++
 ...tain--omitted-width-omitted-height-viewbox.html |  35 ++++
 ...ide--contain--omitted-width-omitted-height.html |  34 ++++
 ...tain--omitted-width-percent-height-viewbox.html |  35 ++++
 ...ide--contain--omitted-width-percent-height.html |  34 ++++
 ...n--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...--contain--percent-width-nonpercent-height.html |  34 ++++
 ...tain--percent-width-omitted-height-viewbox.html |  35 ++++
 ...ide--contain--percent-width-omitted-height.html |  34 ++++
 ...tain--percent-width-percent-height-viewbox.html |  35 ++++
 ...ide--contain--percent-width-percent-height.html |  34 ++++
 ...nonpercent-width-nonpercent-height-viewbox.html |  35 ++++
 ...-cover--nonpercent-width-nonpercent-height.html |  34 ++++
 ...r--nonpercent-width-omitted-height-viewbox.html |  35 ++++
 ...de--cover--nonpercent-width-omitted-height.html |  34 ++++
 ...r--nonpercent-width-percent-height-viewbox.html |  35 ++++
 ...de--cover--nonpercent-width-percent-height.html |  34 ++++
 ...r--omitted-width-nonpercent-height-viewbox.html |  35 ++++
 ...de--cover--omitted-width-nonpercent-height.html |  34 ++++
 ...over--omitted-width-omitted-height-viewbox.html |  35 ++++
 .../wide--cover--omitted-width-omitted-height.html |  34 ++++
 ...over--omitted-width-percent-height-viewbox.html |  35 ++++
 .../wide--cover--omitted-width-percent-height.html |  34 ++++
 ...r--percent-width-nonpercent-height-viewbox.html |  35 ++++
 ...de--cover--percent-width-nonpercent-height.html |  34 ++++
 ...over--percent-width-omitted-height-viewbox.html |  35 ++++
 .../wide--cover--percent-width-omitted-height.html |  34 ++++
 ...over--percent-width-percent-height-viewbox.html |  35 ++++
 .../wide--cover--percent-width-percent-height.html |  34 ++++
 272 files changed, 8766 insertions(+)
 create mode 100644 layout/reftests/backgrounds/vector/diagonal-percentage-vector-background-ref.html
 create mode 100644 layout/reftests/backgrounds/vector/diagonal-percentage-vector-background.html
 create mode 100644 layout/reftests/backgrounds/vector/diagonal-scaled-fixed.svg
 create mode 100644 layout/reftests/backgrounds/vector/diagonal-scaled.svg
 create mode 100644 layout/reftests/backgrounds/vector/empty/intrinsic-ratio-no-dimensions.svg
 create mode 100644 layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-width.svg
 create mode 100644 layout/reftests/backgrounds/vector/empty/nonpercent-width-omitted-height-extreme-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/empty/omitted-width-nonpercent-height-extreme-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/empty/ref-tall-empty.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/ref-tall-lime.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/ref-wide-empty.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/ref-wide-lime.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/reftest.list
 create mode 100644 layout/reftests/backgrounds/vector/empty/tall--contain--height.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/tall--contain--width.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/tall--cover--height.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/tall--cover--width.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/wide--contain--height.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/wide--contain--width.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/wide--cover--height.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/wide--cover--width.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-height-ratio-5px-auto.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-5px.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-auto.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-height-ratio-contain.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-height-ratio-cover.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-5px-auto.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-5px.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-auto.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-contain.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-cover.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-width-ratio-5px-auto.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-5px.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-auto.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-width-ratio-contain.html
 create mode 100644 layout/reftests/backgrounds/vector/empty/zero-width-ratio-cover.html
 create mode 100644 layout/reftests/backgrounds/vector/no-aspect-ratio-normal.html
 create mode 100644 layout/reftests/backgrounds/vector/no-aspect-ratio-wide.html
 create mode 100644 layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/nonpercent-width-omitted-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/nonpercent-width-omitted-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/nonpercent-width-percent-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/nonpercent-width-percent-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-nonpercent-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-nonpercent-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox-no-preserve.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-omitted-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-percent-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/omitted-width-percent-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/percent-width-nonpercent-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/percent-width-nonpercent-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/percent-width-omitted-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/percent-width-omitted-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/percent-width-percent-height-viewbox.svg
 create mode 100644 layout/reftests/backgrounds/vector/percent-width-percent-height.svg
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime192x384-aqua192x384.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime256x16-aqua256x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime256x384-aqua256x384.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime256x512-aqua256x256.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime256x768.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime2x16-aqua2x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime32x128-aqua32x128.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime32x16-aqua32x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime32x256-aqua32x256.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime32x384-aqua32x384.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime32x64-aqua32x64.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime48x384-aqua48x384.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime4x16-aqua4x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime8x16-aqua8x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime8x32-aqua8x32.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime8x384-aqua8x384.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-tall-lime8x64-aqua8x64.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime12x128-aqua12x128.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime12x16-aqua12x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime12x24-aqua12x24.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime12x96-aqua12x96.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime16x128-aqua16x128.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime2x16-aqua2x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime64x128-aqua64x128.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime768x128-aqua768x128.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime768x16-aqua768x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime768x256.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime8x128-aqua8x128.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime8x16-aqua8x16.html
 create mode 100644 layout/reftests/backgrounds/vector/ref-wide-lime8x64-aqua8x64.html
 create mode 100644 layout/reftests/backgrounds/vector/reftest.list
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height--crisp.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox--crisp.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/template.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height-viewbox.html
 create mode 100644 layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height.html

(limited to 'layout/reftests/backgrounds/vector')

diff --git a/layout/reftests/backgrounds/vector/diagonal-percentage-vector-background-ref.html b/layout/reftests/backgrounds/vector/diagonal-percentage-vector-background-ref.html
new file mode 100644
index 0000000000..48af46c0d7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/diagonal-percentage-vector-background-ref.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Scaled vector image without intrinsic dimensions as background, with rendering dependent on the diagonal</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+#outer
+{
+  width: 256px; height: 768px;
+  border: 1px solid black;
+}
+#inner
+{
+  width: 100px; height: 700px;
+  background-image: url(diagonal-scaled-fixed.svg);
+  background-repeat: no-repeat;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/diagonal-percentage-vector-background.html b/layout/reftests/backgrounds/vector/diagonal-percentage-vector-background.html
new file mode 100644
index 0000000000..74fbb8b51c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/diagonal-percentage-vector-background.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>Scaled vector image without intrinsic dimensions as background, with rendering dependent on the diagonal</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+#outer
+{
+  width: 256px; height: 768px;
+  border: 1px solid black;
+}
+#inner
+{
+  width: 100px; height: 700px;
+  background-image: url(diagonal-scaled.svg);
+  background-repeat: no-repeat;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/diagonal-scaled-fixed.svg b/layout/reftests/backgrounds/vector/diagonal-scaled-fixed.svg
new file mode 100644
index 0000000000..bf0dcfb59b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/diagonal-scaled-fixed.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg" width="100px" height="700px">
+  <title>Vector image with intrinsic dimensions, reference for diagonal-scaled.svg</title>
+  <rect y="0" width="100px" height="350px" fill="lime"/>
+  <rect y="350px" width="100px" height="350px" fill="aqua"/>
+  <rect y="175px" width="50px" height="350px" fill="fuchsia"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/diagonal-scaled.svg b/layout/reftests/backgrounds/vector/diagonal-scaled.svg
new file mode 100644
index 0000000000..391a9abe84
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/diagonal-scaled.svg
@@ -0,0 +1,21 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <title>Vector image without intrinsic dimensions with percentage stroke-width (proportional to the diagonal)</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+  <!--
+    A percent stroke-width is resolved with respect to:
+
+      d = sqrt(vh**2 + vw**2) / sqrt(2)
+
+    where vh/vw are the image viewport width/height.  Because this image has no
+    intrinsic dimensions or ratio, it expands to fill the entire background
+    positioning area, so its width is 100px and its height is 700px.  For those
+    carefully-chosen dimensions, d = 500px, so 10% of that creates a 50px-wide
+    rectangle, vertically centered and horizontally left-aligned in the image.
+  -->
+  <line x1="25%" y1="25%" x2="25%" y2="75%" stroke="fuchsia" stroke-width="10%"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-no-dimensions.svg b/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-no-dimensions.svg
new file mode 100644
index 0000000000..e116d8f1f7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-no-dimensions.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     viewBox="0 0 8 0"
+     preserveAspectRatio="none">
+  <title>Image with zero-width ratio, no dimensions</title>
+  <rect y="0" width="100%" height="100%" fill="lime"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-height.svg b/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-height.svg
new file mode 100644
index 0000000000..e691e3f918
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-height.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px"
+     viewBox="0 0 8 0"
+     preserveAspectRatio="none">
+  <title>Image with zero-height ratio, width</title>
+  <rect y="0" width="100%" height="100%" fill="lime"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-width.svg b/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-width.svg
new file mode 100644
index 0000000000..df36531671
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/intrinsic-ratio-zero-width.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px"
+     viewBox="0 0 0 8"
+     preserveAspectRatio="none">
+  <title>Image with zero-width ratio, width</title>
+  <rect y="0" width="100%" height="100%" fill="lime"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/empty/nonpercent-width-omitted-height-extreme-viewbox.svg b/layout/reftests/backgrounds/vector/empty/nonpercent-width-omitted-height-extreme-viewbox.svg
new file mode 100644
index 0000000000..052ed2ab39
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/nonpercent-width-omitted-height-extreme-viewbox.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px"
+     viewBox="0 0 2147483647 1"
+     preserveAspectRatio="none">
+  <title>Image with non-percent width, omitted height, extreme viewbox</title>
+  <rect y="0" width="100%" height="100%" fill="lime"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/empty/omitted-width-nonpercent-height-extreme-viewbox.svg b/layout/reftests/backgrounds/vector/empty/omitted-width-nonpercent-height-extreme-viewbox.svg
new file mode 100644
index 0000000000..9e9b0b431a
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/omitted-width-nonpercent-height-extreme-viewbox.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     height="8px"
+     viewBox="0 0 1 2147483647"
+     preserveAspectRatio="none">
+  <title>Image with omitted width, non-percent height, extreme viewbox</title>
+  <rect y="0" width="100%" height="100%" fill="lime"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/empty/ref-tall-empty.html b/layout/reftests/backgrounds/vector/empty/ref-tall-empty.html
new file mode 100644
index 0000000000..37e411f081
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/ref-tall-empty.html
@@ -0,0 +1,24 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, empty</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+  </style>
+</head>
+<body>
+<div id="outer"></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/ref-tall-lime.html b/layout/reftests/backgrounds/vector/empty/ref-tall-lime.html
new file mode 100644
index 0000000000..d0f18bfcfc
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/ref-tall-lime.html
@@ -0,0 +1,28 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, lime fill</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background: lime;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/ref-wide-empty.html b/layout/reftests/backgrounds/vector/empty/ref-wide-empty.html
new file mode 100644
index 0000000000..16ad533156
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/ref-wide-empty.html
@@ -0,0 +1,21 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, empty</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+  border: 1px solid black;
+}
+  </style>
+</head>
+<body>
+<div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/ref-wide-lime.html b/layout/reftests/backgrounds/vector/empty/ref-wide-lime.html
new file mode 100644
index 0000000000..7ae51768a8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/ref-wide-lime.html
@@ -0,0 +1,28 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, empty</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background: lime;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/reftest.list b/layout/reftests/backgrounds/vector/empty/reftest.list
new file mode 100644
index 0000000000..d83e5c1da6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/reftest.list
@@ -0,0 +1,26 @@
+== tall--contain--height.html ref-tall-empty.html
+== tall--contain--width.html ref-tall-empty.html
+== wide--contain--height.html ref-wide-empty.html
+== wide--contain--width.html ref-wide-empty.html
+
+# These tests fail because of integer overflow; see bug 894555.
+fails == tall--cover--height.html ref-tall-lime.html
+fails == tall--cover--width.html ref-tall-lime.html
+fails == wide--cover--height.html ref-wide-lime.html
+fails == wide--cover--width.html ref-wide-lime.html
+
+== zero-height-ratio-contain.html ref-tall-empty.html
+== zero-height-ratio-cover.html ref-tall-empty.html
+== zero-height-ratio-auto-auto.html ref-tall-empty.html
+== zero-height-ratio-auto-5px.html ref-tall-empty.html
+== zero-height-ratio-5px-auto.html ref-tall-empty.html
+== zero-width-ratio-contain.html ref-tall-empty.html
+== zero-width-ratio-cover.html ref-tall-empty.html
+== zero-width-ratio-auto-auto.html ref-tall-empty.html
+== zero-width-ratio-auto-5px.html ref-tall-empty.html
+== zero-width-ratio-5px-auto.html ref-tall-empty.html
+== zero-ratio-no-dimensions-contain.html ref-tall-empty.html
+== zero-ratio-no-dimensions-cover.html ref-tall-empty.html
+== zero-ratio-no-dimensions-auto-5px.html ref-tall-empty.html
+== zero-ratio-no-dimensions-5px-auto.html ref-tall-empty.html
+== zero-ratio-no-dimensions-auto-auto.html ref-tall-empty.html
diff --git a/layout/reftests/backgrounds/vector/empty/tall--contain--height.html b/layout/reftests/backgrounds/vector/empty/tall--contain--height.html
new file mode 100644
index 0000000000..8c0d38a301
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/tall--contain--height.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-omitted-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/tall--contain--width.html b/layout/reftests/backgrounds/vector/empty/tall--contain--width.html
new file mode 100644
index 0000000000..2fe4ac8d83
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/tall--contain--width.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-nonpercent-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/tall--cover--height.html b/layout/reftests/backgrounds/vector/empty/tall--cover--height.html
new file mode 100644
index 0000000000..be40ed2e8c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/tall--cover--height.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-omitted-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/tall--cover--width.html b/layout/reftests/backgrounds/vector/empty/tall--cover--width.html
new file mode 100644
index 0000000000..e4fea72c9b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/tall--cover--width.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-nonpercent-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/wide--contain--height.html b/layout/reftests/backgrounds/vector/empty/wide--contain--height.html
new file mode 100644
index 0000000000..e81082f106
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/wide--contain--height.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-omitted-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/wide--contain--width.html b/layout/reftests/backgrounds/vector/empty/wide--contain--width.html
new file mode 100644
index 0000000000..2b88a018c9
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/wide--contain--width.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-nonpercent-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/wide--cover--height.html b/layout/reftests/backgrounds/vector/empty/wide--cover--height.html
new file mode 100644
index 0000000000..7b6c323e41
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/wide--cover--height.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-omitted-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/wide--cover--width.html b/layout/reftests/backgrounds/vector/empty/wide--cover--width.html
new file mode 100644
index 0000000000..beb516db31
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/wide--cover--width.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-nonpercent-height-extreme-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-extreme-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-height-ratio-5px-auto.html b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-5px-auto.html
new file mode 100644
index 0000000000..059a075fdc
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-5px-auto.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, 5px auto</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-height.svg);
+  background-repeat: no-repeat;
+  background-size: 5px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-5px.html b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-5px.html
new file mode 100644
index 0000000000..99a0b070cd
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-5px.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, auto 5px</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 5px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-auto.html b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-auto.html
new file mode 100644
index 0000000000..82d34bfee0
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-auto-auto.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, auto auto</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-height-ratio-contain.html b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-contain.html
new file mode 100644
index 0000000000..caf6c57d6d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-contain.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, contain</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-height-ratio-cover.html b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-cover.html
new file mode 100644
index 0000000000..a34dd61648
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-height-ratio-cover.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, cover</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-5px-auto.html b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-5px-auto.html
new file mode 100644
index 0000000000..2581e299b8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-5px-auto.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero ratio, no dimensions, 5px auto</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-no-dimensions.svg);
+  background-repeat: no-repeat;
+  background-size: 5px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-5px.html b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-5px.html
new file mode 100644
index 0000000000..4198c9d06d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-5px.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero ratio, no dimensions, auto 5px</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-no-dimensions.svg);
+  background-repeat: no-repeat;
+  background-size: auto 5px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-auto.html b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-auto.html
new file mode 100644
index 0000000000..85c20fd1e3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-auto-auto.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero ratio, no dimensions, auto auto</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-no-dimensions.svg);
+  background-repeat: no-repeat;
+  background-size: auto auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-contain.html b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-contain.html
new file mode 100644
index 0000000000..fa62a25316
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-contain.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero ratio, no dimensions, contain</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-no-dimensions.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-cover.html b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-cover.html
new file mode 100644
index 0000000000..771269e2cb
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-ratio-no-dimensions-cover.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero ratio, no dimensions, cover</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-no-dimensions.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-width-ratio-5px-auto.html b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-5px-auto.html
new file mode 100644
index 0000000000..675e75b396
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-5px-auto.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, 5px auto</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-width.svg);
+  background-repeat: no-repeat;
+  background-size: 5px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-5px.html b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-5px.html
new file mode 100644
index 0000000000..c16d11df76
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-5px.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero height ratio, auto 5px</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-width.svg);
+  background-repeat: no-repeat;
+  background-size: auto 5px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-auto.html b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-auto.html
new file mode 100644
index 0000000000..78a7327ab1
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-auto-auto.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero width ratio, auto auto</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-width.svg);
+  background-repeat: no-repeat;
+  background-size: auto auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-width-ratio-contain.html b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-contain.html
new file mode 100644
index 0000000000..5604983772
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-contain.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero width ratio, contain</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-width.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/empty/zero-width-ratio-cover.html b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-cover.html
new file mode 100644
index 0000000000..a1e6c52f4d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/empty/zero-width-ratio-cover.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>zero width ratio, cover</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(intrinsic-ratio-zero-width.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/no-aspect-ratio-normal.html b/layout/reftests/backgrounds/vector/no-aspect-ratio-normal.html
new file mode 100644
index 0000000000..72140a91af
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/no-aspect-ratio-normal.html
@@ -0,0 +1,28 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>32px background positioning area size; 32px 32px background-size; for omitted-width-omitted-height-viewbox-no-preserve.svg</title>
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+#inner
+{
+  width: 32px;
+  height: 32px;
+	background-image: url(omitted-width-omitted-height-viewbox-no-preserve.svg);
+  background-repeat: no-repeat;
+  background-size: 32px 32px;
+}
+  </style>
+</head>
+<body>
+<div id="inner"></div>
+</body>
+</html>
\ No newline at end of file
diff --git a/layout/reftests/backgrounds/vector/no-aspect-ratio-wide.html b/layout/reftests/backgrounds/vector/no-aspect-ratio-wide.html
new file mode 100644
index 0000000000..fd110f617a
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/no-aspect-ratio-wide.html
@@ -0,0 +1,28 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background positioning area size; 32px 32px 32px 32px background-size; for omitted-width-omitted-height-viewbox-no-preserve.svg</title>
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+#inner
+{
+  width: 640px;
+  height: 32px;
+	background-image: url(omitted-width-omitted-height-viewbox-no-preserve.svg);
+  background-repeat: no-repeat;
+  background-size: 32px 32px;
+}
+  </style>
+</head>
+<body>
+<div id="inner"></div>
+</body>
+</html>
\ No newline at end of file
diff --git a/layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height-viewbox.svg b/layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height-viewbox.svg
new file mode 100644
index 0000000000..9014ad5bf6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px" height="32px"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with non-percent width, non-percent height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height.svg b/layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height.svg
new file mode 100644
index 0000000000..60f9e724e0
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/nonpercent-width-nonpercent-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px" height="32px">
+  <title>Image with non-percentage dimensions</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/nonpercent-width-omitted-height-viewbox.svg b/layout/reftests/backgrounds/vector/nonpercent-width-omitted-height-viewbox.svg
new file mode 100644
index 0000000000..8c794b6139
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/nonpercent-width-omitted-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with non-percent width, omitted height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/nonpercent-width-omitted-height.svg b/layout/reftests/backgrounds/vector/nonpercent-width-omitted-height.svg
new file mode 100644
index 0000000000..b506e625db
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/nonpercent-width-omitted-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px">
+  <title>Image with non-percent width, omitted height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/nonpercent-width-percent-height-viewbox.svg b/layout/reftests/backgrounds/vector/nonpercent-width-percent-height-viewbox.svg
new file mode 100644
index 0000000000..3a114ccc54
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/nonpercent-width-percent-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px" height="50%"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with non-percent width, percent height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/nonpercent-width-percent-height.svg b/layout/reftests/backgrounds/vector/nonpercent-width-percent-height.svg
new file mode 100644
index 0000000000..398291e3b7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/nonpercent-width-percent-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="8px" height="50%">
+  <title>Image with non-percent width, percent height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-nonpercent-height-viewbox.svg b/layout/reftests/backgrounds/vector/omitted-width-nonpercent-height-viewbox.svg
new file mode 100644
index 0000000000..ebf4d94ec4
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-nonpercent-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     height="32px"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with omitted width, non-percent height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-nonpercent-height.svg b/layout/reftests/backgrounds/vector/omitted-width-nonpercent-height.svg
new file mode 100644
index 0000000000..b6985ad010
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-nonpercent-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     height="32px">
+  <title>Image with omitted width, non-percent height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox-no-preserve.svg b/layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox-no-preserve.svg
new file mode 100644
index 0000000000..9acae51aa8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox-no-preserve.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     viewBox="0 0 64 64">
+  <title>Image with omitted width, omitted height, viewbox, don't preserve aspect ratio</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox.svg b/layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox.svg
new file mode 100644
index 0000000000..bcea95cdc9
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-omitted-height-viewbox.svg
@@ -0,0 +1,11 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with omitted width, omitted height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-omitted-height.svg b/layout/reftests/backgrounds/vector/omitted-width-omitted-height.svg
new file mode 100644
index 0000000000..d086213878
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-omitted-height.svg
@@ -0,0 +1,9 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg">
+  <title>Image with omitted width, omitted height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-percent-height-viewbox.svg b/layout/reftests/backgrounds/vector/omitted-width-percent-height-viewbox.svg
new file mode 100644
index 0000000000..265c26a9a8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-percent-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     height="50%"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with omitted width, percent height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/omitted-width-percent-height.svg b/layout/reftests/backgrounds/vector/omitted-width-percent-height.svg
new file mode 100644
index 0000000000..b44560175d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/omitted-width-percent-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     height="50%">
+  <title>Image with omitted width, percent height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/percent-width-nonpercent-height-viewbox.svg b/layout/reftests/backgrounds/vector/percent-width-nonpercent-height-viewbox.svg
new file mode 100644
index 0000000000..645c4c0244
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/percent-width-nonpercent-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="50%" height="32px"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with percent width, non-percent height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/percent-width-nonpercent-height.svg b/layout/reftests/backgrounds/vector/percent-width-nonpercent-height.svg
new file mode 100644
index 0000000000..e733115019
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/percent-width-nonpercent-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="50%" height="32px">
+  <title>Image with percent width, non-percent height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/percent-width-omitted-height-viewbox.svg b/layout/reftests/backgrounds/vector/percent-width-omitted-height-viewbox.svg
new file mode 100644
index 0000000000..ef0a467678
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/percent-width-omitted-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="50%"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with percent width, omitted height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/percent-width-omitted-height.svg b/layout/reftests/backgrounds/vector/percent-width-omitted-height.svg
new file mode 100644
index 0000000000..76e9cef3c6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/percent-width-omitted-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="50%">
+  <title>Image with percent width, omitted height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/percent-width-percent-height-viewbox.svg b/layout/reftests/backgrounds/vector/percent-width-percent-height-viewbox.svg
new file mode 100644
index 0000000000..be23fe2d2d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/percent-width-percent-height-viewbox.svg
@@ -0,0 +1,12 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="25%" height="50%"
+     viewBox="0 0 4 64"
+     preserveAspectRatio="none">
+  <title>Image with percent width, percent height, viewbox</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/percent-width-percent-height.svg b/layout/reftests/backgrounds/vector/percent-width-percent-height.svg
new file mode 100644
index 0000000000..db197fb304
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/percent-width-percent-height.svg
@@ -0,0 +1,10 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<svg xmlns="http://www.w3.org/2000/svg"
+     width="25%" height="50%">
+  <title>Image with percent width, percent height</title>
+  <rect y="0" width="100%" height="50%" fill="lime"/>
+  <rect y="50%" width="100%" height="50%" fill="aqua"/>
+</svg>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime192x384-aqua192x384.html b/layout/reftests/backgrounds/vector/ref-tall-lime192x384-aqua192x384.html
new file mode 100644
index 0000000000..c6e0f556af
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime192x384-aqua192x384.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 192x384 lime, 192x384 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 192px; height: 768px;
+}
+#inner > div { width: 192px; height: 384px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime256x16-aqua256x16.html b/layout/reftests/backgrounds/vector/ref-tall-lime256x16-aqua256x16.html
new file mode 100644
index 0000000000..8e31125cc4
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime256x16-aqua256x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 256x16 lime, 256x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 256px; height: 32px;
+}
+#inner > div { width: 256px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime256x384-aqua256x384.html b/layout/reftests/backgrounds/vector/ref-tall-lime256x384-aqua256x384.html
new file mode 100644
index 0000000000..1060860355
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime256x384-aqua256x384.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 256x384 lime, 256x384 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 256px; height: 768px;
+}
+#inner > div { width: 256px; height: 384px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime256x512-aqua256x256.html b/layout/reftests/backgrounds/vector/ref-tall-lime256x512-aqua256x256.html
new file mode 100644
index 0000000000..9b67682cd7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime256x512-aqua256x256.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 256x512 lime, 256x256 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 256px; height: 768px;
+}
+#inner > div { width: 256px; }
+#top { background-color: lime; height: 512px; }
+#bottom { background-color: aqua; height: 256px; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime256x768.html b/layout/reftests/backgrounds/vector/ref-tall-lime256x768.html
new file mode 100644
index 0000000000..792c7d7c06
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime256x768.html
@@ -0,0 +1,22 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 256x512 lime, 256x256 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+#outer
+{
+  width: 256px; height: 768px;
+  background-color: lime;
+  border: 1px solid black;
+}
+  </style>
+</head>
+<body>
+<div id="outer"></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime2x16-aqua2x16.html b/layout/reftests/backgrounds/vector/ref-tall-lime2x16-aqua2x16.html
new file mode 100644
index 0000000000..d95edcda43
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime2x16-aqua2x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 2x16 lime, 2x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 2px; height: 32px;
+}
+#inner > div { width: 2px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime32x128-aqua32x128.html b/layout/reftests/backgrounds/vector/ref-tall-lime32x128-aqua32x128.html
new file mode 100644
index 0000000000..dbd1e1bfde
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime32x128-aqua32x128.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 32x128 lime, 32x128 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 32px; height: 256px;
+}
+#inner > div { width: 32px; height: 128px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime32x16-aqua32x16.html b/layout/reftests/backgrounds/vector/ref-tall-lime32x16-aqua32x16.html
new file mode 100644
index 0000000000..00316e0749
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime32x16-aqua32x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 32x16 lime, 32x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 32px; height: 32px;
+}
+#inner > div { width: 32px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime32x256-aqua32x256.html b/layout/reftests/backgrounds/vector/ref-tall-lime32x256-aqua32x256.html
new file mode 100644
index 0000000000..c4d9ab0cf8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime32x256-aqua32x256.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 32x256 lime, 32x256 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 32px; height: 512px;
+}
+#inner > div { width: 32px; height: 256px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime32x384-aqua32x384.html b/layout/reftests/backgrounds/vector/ref-tall-lime32x384-aqua32x384.html
new file mode 100644
index 0000000000..aa78e40a7c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime32x384-aqua32x384.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 32x384 lime, 32x384 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 32px; height: 768px;
+}
+#inner > div { width: 32px; height: 384px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime32x64-aqua32x64.html b/layout/reftests/backgrounds/vector/ref-tall-lime32x64-aqua32x64.html
new file mode 100644
index 0000000000..f7ffadb7b7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime32x64-aqua32x64.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 32x64 lime, 32x64 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 32px; height: 128px;
+}
+#inner > div { width: 32px; height: 64px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime48x384-aqua48x384.html b/layout/reftests/backgrounds/vector/ref-tall-lime48x384-aqua48x384.html
new file mode 100644
index 0000000000..2153798ff6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime48x384-aqua48x384.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 48x384 lime, 48x384 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 48px; height: 768px;
+}
+#inner > div { width: 48px; height: 384px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime4x16-aqua4x16.html b/layout/reftests/backgrounds/vector/ref-tall-lime4x16-aqua4x16.html
new file mode 100644
index 0000000000..fc9b39883e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime4x16-aqua4x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 4x16 lime, 4x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 4px; height: 32px;
+}
+#inner > div { width: 4px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime8x16-aqua8x16.html b/layout/reftests/backgrounds/vector/ref-tall-lime8x16-aqua8x16.html
new file mode 100644
index 0000000000..2275861a03
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime8x16-aqua8x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 8x16 lime, 8x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 32px;
+}
+#inner > div { width: 8px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime8x32-aqua8x32.html b/layout/reftests/backgrounds/vector/ref-tall-lime8x32-aqua8x32.html
new file mode 100644
index 0000000000..804a16dd22
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime8x32-aqua8x32.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 8x32 lime, 8x32 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 64px;
+}
+#inner > div { width: 8px; height: 32px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime8x384-aqua8x384.html b/layout/reftests/backgrounds/vector/ref-tall-lime8x384-aqua8x384.html
new file mode 100644
index 0000000000..c9ce995ff5
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime8x384-aqua8x384.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 8x384 lime, 8x384 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 768px;
+}
+#inner > div { width: 8px; height: 384px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-tall-lime8x64-aqua8x64.html b/layout/reftests/backgrounds/vector/ref-tall-lime8x64-aqua8x64.html
new file mode 100644
index 0000000000..8c80b0d431
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-tall-lime8x64-aqua8x64.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall reference, 8x64 lime, 8x64 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 128px;
+}
+#inner > div { width: 8px; height: 64px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime12x128-aqua12x128.html b/layout/reftests/backgrounds/vector/ref-wide-lime12x128-aqua12x128.html
new file mode 100644
index 0000000000..dbb2549ee6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime12x128-aqua12x128.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 12x128 lime, 12x128 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 12px; height: 256px;
+}
+#inner > div { width: 12px; height: 128px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime12x16-aqua12x16.html b/layout/reftests/backgrounds/vector/ref-wide-lime12x16-aqua12x16.html
new file mode 100644
index 0000000000..3ac4d56eaa
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime12x16-aqua12x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 12x16 lime, 12x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 12px; height: 32px;
+}
+#inner > div { width: 12px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime12x24-aqua12x24.html b/layout/reftests/backgrounds/vector/ref-wide-lime12x24-aqua12x24.html
new file mode 100644
index 0000000000..72fd8a2632
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime12x24-aqua12x24.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 12x24 lime, 12x24 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 12px; height: 48px;
+}
+#inner > div { width: 12px; height: 24px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime12x96-aqua12x96.html b/layout/reftests/backgrounds/vector/ref-wide-lime12x96-aqua12x96.html
new file mode 100644
index 0000000000..f7640c61d5
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime12x96-aqua12x96.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 12x96 lime, 12x96 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 12px; height: 192px;
+}
+#inner > div { width: 12px; height: 96px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime16x128-aqua16x128.html b/layout/reftests/backgrounds/vector/ref-wide-lime16x128-aqua16x128.html
new file mode 100644
index 0000000000..d19a76d100
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime16x128-aqua16x128.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 16x128 lime, 16x128 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 16px; height: 256px;
+}
+#inner > div { width: 16px; height: 128px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime2x16-aqua2x16.html b/layout/reftests/backgrounds/vector/ref-wide-lime2x16-aqua2x16.html
new file mode 100644
index 0000000000..7db5654de3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime2x16-aqua2x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 2x16 lime, 2x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 2px; height: 32px;
+}
+#inner > div { width: 2px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime64x128-aqua64x128.html b/layout/reftests/backgrounds/vector/ref-wide-lime64x128-aqua64x128.html
new file mode 100644
index 0000000000..9bfd66385e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime64x128-aqua64x128.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 64x128 lime, 64x128 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 64px; height: 256px;
+}
+#inner > div { width: 64px; height: 128px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime768x128-aqua768x128.html b/layout/reftests/backgrounds/vector/ref-wide-lime768x128-aqua768x128.html
new file mode 100644
index 0000000000..68de63ce7a
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime768x128-aqua768x128.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 768x128 lime, 768x128 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 768px; height: 256px;
+}
+#inner > div { width: 768px; height: 128px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime768x16-aqua768x16.html b/layout/reftests/backgrounds/vector/ref-wide-lime768x16-aqua768x16.html
new file mode 100644
index 0000000000..ed521f5bac
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime768x16-aqua768x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 768x16 lime, 768x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 768px; height: 32px;
+}
+#inner > div { width: 768px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime768x256.html b/layout/reftests/backgrounds/vector/ref-wide-lime768x256.html
new file mode 100644
index 0000000000..137d4f2cdd
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime768x256.html
@@ -0,0 +1,29 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 768x256 lime</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 768px; height: 256px;
+  background-color: lime;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime8x128-aqua8x128.html b/layout/reftests/backgrounds/vector/ref-wide-lime8x128-aqua8x128.html
new file mode 100644
index 0000000000..7328e5b121
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime8x128-aqua8x128.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 8x128 lime, 8x128 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 256px;
+}
+#inner > div { width: 8px; height: 128px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime8x16-aqua8x16.html b/layout/reftests/backgrounds/vector/ref-wide-lime8x16-aqua8x16.html
new file mode 100644
index 0000000000..ee84895643
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime8x16-aqua8x16.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 8x16 lime, 8x16 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 32px;
+}
+#inner > div { width: 8px; height: 16px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/ref-wide-lime8x64-aqua8x64.html b/layout/reftests/backgrounds/vector/ref-wide-lime8x64-aqua8x64.html
new file mode 100644
index 0000000000..069617c2b3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/ref-wide-lime8x64-aqua8x64.html
@@ -0,0 +1,31 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide reference, 8x64 lime, 8x64 aqua</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  width: 8px; height: 128px;
+}
+#inner > div { width: 8px; height: 64px; }
+#top { background-color: lime; }
+#bottom { background-color: aqua; }
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"><div id="top"></div><div id="bottom"></div></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/reftest.list b/layout/reftests/backgrounds/vector/reftest.list
new file mode 100644
index 0000000000..2ed940449d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/reftest.list
@@ -0,0 +1,204 @@
+include empty/reftest.list
+
+################################################################################
+# For reference (although the wide--32px-auto* tests/names were changed to
+# avoid viewBox-directed scaling to make the scaled height less than the wide-
+# tests height):
+#
+# for ORIENTATION in tall wide; do for SIZE in 32px-auto auto-32px auto contain cover; do for VIMAGE in *.svg; do cat template.html | sed -e "s/SIZE/$(echo $SIZE | sed -e 's/-/ /')/g" | sed -e "s/VIMAGE/$VIMAGE/g" | sed -e "s/TALLWIDE/$ORIENTATION/g" | sed -e "s/ORIENTATION/$(if [ "$ORIENTATION" = "tall" ]; then echo 'width: 256px; height: 768px'; else echo 'width: 768px; height: 256px'; fi)/g" > $ORIENTATION--$SIZE--$(echo $VIMAGE | sed -e 's/.svg//').html; echo "== $ORIENTATION--$SIZE--$(echo $VIMAGE | sed -e 's/.svg//').html ###" >> reftest.list; done; echo >> reftest.list; done; done
+#
+################################################################################
+
+== tall--32px-auto--nonpercent-width-nonpercent-height.html ref-tall-lime32x64-aqua32x64.html
+== tall--32px-auto--nonpercent-width-nonpercent-height-viewbox.html ref-tall-lime32x64-aqua32x64.html
+== tall--32px-auto--nonpercent-width-omitted-height.html ref-tall-lime32x384-aqua32x384.html
+== tall--32px-auto--nonpercent-width-omitted-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--nonpercent-width-percent-height.html ref-tall-lime32x384-aqua32x384.html
+== tall--32px-auto--nonpercent-width-percent-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--omitted-width-nonpercent-height.html ref-tall-lime32x16-aqua32x16.html
+== tall--32px-auto--omitted-width-nonpercent-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--omitted-width-omitted-height.html ref-tall-lime32x384-aqua32x384.html
+== tall--32px-auto--omitted-width-omitted-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--omitted-width-percent-height.html ref-tall-lime32x384-aqua32x384.html
+== tall--32px-auto--omitted-width-percent-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--percent-width-nonpercent-height.html ref-tall-lime32x16-aqua32x16.html
+== tall--32px-auto--percent-width-nonpercent-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--percent-width-omitted-height.html ref-tall-lime32x384-aqua32x384.html
+== tall--32px-auto--percent-width-omitted-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+== tall--32px-auto--percent-width-percent-height.html ref-tall-lime32x384-aqua32x384.html
+== tall--32px-auto--percent-width-percent-height-viewbox.html ref-tall-lime32x256-aqua32x256.html
+
+== tall--auto-32px--nonpercent-width-nonpercent-height.html ref-tall-lime8x16-aqua8x16.html
+== tall--auto-32px--nonpercent-width-nonpercent-height-viewbox.html ref-tall-lime8x16-aqua8x16.html
+== tall--auto-32px--nonpercent-width-omitted-height.html ref-tall-lime8x16-aqua8x16.html # bug 773482
+== tall--auto-32px--nonpercent-width-omitted-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--nonpercent-width-percent-height.html ref-tall-lime8x16-aqua8x16.html
+== tall--auto-32px--nonpercent-width-percent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--omitted-width-nonpercent-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto-32px--omitted-width-nonpercent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--omitted-width-omitted-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto-32px--omitted-width-omitted-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--omitted-width-percent-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto-32px--omitted-width-percent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--percent-width-nonpercent-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto-32px--percent-width-nonpercent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--percent-width-omitted-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto-32px--percent-width-omitted-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto-32px--percent-width-percent-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto-32px--percent-width-percent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+
+== tall--auto--nonpercent-width-nonpercent-height.html ref-tall-lime8x16-aqua8x16.html
+== tall--auto--nonpercent-width-nonpercent-height-viewbox.html ref-tall-lime8x16-aqua8x16.html
+== tall--auto--nonpercent-width-omitted-height.html ref-tall-lime8x384-aqua8x384.html
+== tall--auto--nonpercent-width-omitted-height-viewbox.html ref-tall-lime8x64-aqua8x64.html
+== tall--auto--nonpercent-width-percent-height.html ref-tall-lime8x384-aqua8x384.html
+== tall--auto--nonpercent-width-percent-height-viewbox.html ref-tall-lime8x64-aqua8x64.html
+== tall--auto--omitted-width-nonpercent-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto--omitted-width-nonpercent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto--omitted-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--auto--omitted-width-omitted-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--auto--omitted-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--auto--omitted-width-percent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--auto--percent-width-nonpercent-height.html ref-tall-lime256x16-aqua256x16.html
+== tall--auto--percent-width-nonpercent-height-viewbox.html ref-tall-lime2x16-aqua2x16.html
+== tall--auto--percent-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--auto--percent-width-omitted-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--auto--percent-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--auto--percent-width-percent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+
+== tall--contain--nonpercent-width-nonpercent-height.html ref-tall-lime192x384-aqua192x384.html
+== tall--contain--nonpercent-width-nonpercent-height-viewbox.html ref-tall-lime192x384-aqua192x384.html
+== tall--contain--nonpercent-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--nonpercent-width-omitted-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--nonpercent-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--nonpercent-width-percent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--omitted-width-nonpercent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--omitted-width-nonpercent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--omitted-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--omitted-width-omitted-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--omitted-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--omitted-width-percent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--percent-width-nonpercent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--percent-width-nonpercent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--percent-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--percent-width-omitted-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--contain--percent-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--contain--percent-width-percent-height-viewbox.html ref-tall-lime48x384-aqua48x384.html
+== tall--cover--nonpercent-width-nonpercent-height.html ref-tall-lime256x512-aqua256x256.html
+== tall--cover--nonpercent-width-nonpercent-height-viewbox.html ref-tall-lime256x512-aqua256x256.html
+== tall--cover--nonpercent-width-nonpercent-height--crisp.html ref-tall-lime256x512-aqua256x256.html
+== tall--cover--nonpercent-width-nonpercent-height-viewbox--crisp.html ref-tall-lime256x512-aqua256x256.html
+== tall--cover--nonpercent-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--nonpercent-width-omitted-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--nonpercent-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--nonpercent-width-percent-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--omitted-width-nonpercent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--omitted-width-nonpercent-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--omitted-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--omitted-width-omitted-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--omitted-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--omitted-width-percent-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--percent-width-nonpercent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--percent-width-nonpercent-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--percent-width-omitted-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--percent-width-omitted-height-viewbox.html ref-tall-lime256x768.html
+== tall--cover--percent-width-percent-height.html ref-tall-lime256x384-aqua256x384.html
+== tall--cover--percent-width-percent-height-viewbox.html ref-tall-lime256x768.html
+
+== wide--12px-auto--nonpercent-width-nonpercent-height.html ref-wide-lime12x24-aqua12x24.html
+== wide--12px-auto--nonpercent-width-nonpercent-height-viewbox.html ref-wide-lime12x24-aqua12x24.html
+== wide--12px-auto--nonpercent-width-omitted-height.html ref-wide-lime12x128-aqua12x128.html
+== wide--12px-auto--nonpercent-width-omitted-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--nonpercent-width-percent-height.html ref-wide-lime12x128-aqua12x128.html
+== wide--12px-auto--nonpercent-width-percent-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--omitted-width-nonpercent-height.html ref-wide-lime12x16-aqua12x16.html
+== wide--12px-auto--omitted-width-nonpercent-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--omitted-width-omitted-height.html ref-wide-lime12x128-aqua12x128.html
+== wide--12px-auto--omitted-width-omitted-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--omitted-width-percent-height.html ref-wide-lime12x128-aqua12x128.html
+== wide--12px-auto--omitted-width-percent-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--percent-width-nonpercent-height.html ref-wide-lime12x16-aqua12x16.html
+== wide--12px-auto--percent-width-nonpercent-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--percent-width-omitted-height.html ref-wide-lime12x128-aqua12x128.html
+== wide--12px-auto--percent-width-omitted-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+== wide--12px-auto--percent-width-percent-height.html ref-wide-lime12x128-aqua12x128.html
+== wide--12px-auto--percent-width-percent-height-viewbox.html ref-wide-lime12x96-aqua12x96.html
+
+== wide--auto-32px--nonpercent-width-nonpercent-height.html ref-wide-lime8x16-aqua8x16.html
+== wide--auto-32px--nonpercent-width-nonpercent-height-viewbox.html ref-wide-lime8x16-aqua8x16.html
+== wide--auto-32px--nonpercent-width-omitted-height.html ref-wide-lime8x16-aqua8x16.html
+== wide--auto-32px--nonpercent-width-omitted-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--nonpercent-width-percent-height.html ref-wide-lime8x16-aqua8x16.html
+== wide--auto-32px--nonpercent-width-percent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--omitted-width-nonpercent-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto-32px--omitted-width-nonpercent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--omitted-width-omitted-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto-32px--omitted-width-omitted-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--omitted-width-percent-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto-32px--omitted-width-percent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--percent-width-nonpercent-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto-32px--percent-width-nonpercent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--percent-width-omitted-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto-32px--percent-width-omitted-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto-32px--percent-width-percent-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto-32px--percent-width-percent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+
+== wide--auto--nonpercent-width-nonpercent-height.html ref-wide-lime8x16-aqua8x16.html
+== wide--auto--nonpercent-width-nonpercent-height-viewbox.html ref-wide-lime8x16-aqua8x16.html
+== wide--auto--nonpercent-width-omitted-height.html ref-wide-lime8x128-aqua8x128.html
+== wide--auto--nonpercent-width-omitted-height-viewbox.html ref-wide-lime8x64-aqua8x64.html
+== wide--auto--nonpercent-width-percent-height.html ref-wide-lime8x128-aqua8x128.html
+== wide--auto--nonpercent-width-percent-height-viewbox.html ref-wide-lime8x64-aqua8x64.html
+== wide--auto--omitted-width-nonpercent-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto--omitted-width-nonpercent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto--omitted-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--auto--omitted-width-omitted-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--auto--omitted-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--auto--omitted-width-percent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--auto--percent-width-nonpercent-height.html ref-wide-lime768x16-aqua768x16.html
+== wide--auto--percent-width-nonpercent-height-viewbox.html ref-wide-lime2x16-aqua2x16.html
+== wide--auto--percent-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--auto--percent-width-omitted-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--auto--percent-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--auto--percent-width-percent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+
+== wide--contain--nonpercent-width-nonpercent-height.html ref-wide-lime64x128-aqua64x128.html
+== wide--contain--nonpercent-width-nonpercent-height-viewbox.html ref-wide-lime64x128-aqua64x128.html
+== wide--contain--nonpercent-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--nonpercent-width-omitted-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--nonpercent-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--nonpercent-width-percent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--omitted-width-nonpercent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--omitted-width-nonpercent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--omitted-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--omitted-width-omitted-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--omitted-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--omitted-width-percent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--percent-width-nonpercent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--percent-width-nonpercent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--percent-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--percent-width-omitted-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+== wide--contain--percent-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--contain--percent-width-percent-height-viewbox.html ref-wide-lime16x128-aqua16x128.html
+
+== wide--cover--nonpercent-width-nonpercent-height.html ref-wide-lime768x256.html
+== wide--cover--nonpercent-width-nonpercent-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--nonpercent-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--nonpercent-width-omitted-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--nonpercent-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--nonpercent-width-percent-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--omitted-width-nonpercent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--omitted-width-nonpercent-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--omitted-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--omitted-width-omitted-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--omitted-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--omitted-width-percent-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--percent-width-nonpercent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--percent-width-nonpercent-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--percent-width-omitted-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--percent-width-omitted-height-viewbox.html ref-wide-lime768x256.html
+== wide--cover--percent-width-percent-height.html ref-wide-lime768x128-aqua768x128.html
+== wide--cover--percent-width-percent-height-viewbox.html ref-wide-lime768x256.html
+
+== diagonal-percentage-vector-background.html diagonal-percentage-vector-background-ref.html
+== no-aspect-ratio-wide.html no-aspect-ratio-normal.html
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..028bb9f772
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..a82322c011
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..9f6ff8ee74
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..3dc583a7fe
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..eb665efd30
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..2f56317a1e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..b7488305e5
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..9a666cc72d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..79662459b4
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..4e7486893c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..dc68871035
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height.html
new file mode 100644
index 0000000000..947ec8df97
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..f07a9cfc6e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..98a4eeaa55
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..bbd28a5582
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height.html
new file mode 100644
index 0000000000..612030bd41
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..597111ff61
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height.html
new file mode 100644
index 0000000000..8e8ba9e28e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--32px-auto--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: 32px auto; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 32px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..381442e9ff
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..535249a435
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..a21c0b59a3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..613ceea0c5
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..704ed5ec0b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..b44f11eb45
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..9dba9aa4c8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..b1738e19d6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..a33d5f226f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..6bad152af0
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..e420967682
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height.html
new file mode 100644
index 0000000000..0f47281a3d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..16d3633526
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..bcade3197f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..570ec91cf7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height.html
new file mode 100644
index 0000000000..36566da208
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..c9bcaaabaf
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height.html
new file mode 100644
index 0000000000..784d15b630
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..32e6a6ab3b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..f07ca6aba0
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..15061db707
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..2a2e99a316
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..6c7855d680
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..320ab0e01f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..f0129ba215
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..700142d5ab
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..effa92b3f1
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..5a5ce372d6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..a38195c7cd
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height.html
new file mode 100644
index 0000000000..0e3b7a1e49
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..d763734804
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..93d5bc2aa1
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..dec3128672
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height.html
new file mode 100644
index 0000000000..4f8e57da70
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..61c83a481b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height.html
new file mode 100644
index 0000000000..c1c35a8cdf
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--auto-32px--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: auto 32px; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..35c5224568
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..0460b94298
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..1b9a541f99
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..95a5c1574c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..3f8fdd2391
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..4d365e0a55
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..82d9d3d944
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..6fb7f6aa56
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..0ddec7426d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..453aeca773
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..e34d8703ed
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height.html
new file mode 100644
index 0000000000..986eb2b526
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..bca47e5d17
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..56e0587a35
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..c758225bc1
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height.html
new file mode 100644
index 0000000000..e454f28fc4
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..0123410e32
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height.html
new file mode 100644
index 0000000000..14c483e235
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--contain--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: contain; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height--crisp.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height--crisp.html
new file mode 100644
index 0000000000..00356e83bf
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height--crisp.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+  image-rendering: -moz-crisp-edges;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox--crisp.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox--crisp.html
new file mode 100644
index 0000000000..71e9790ebf
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox--crisp.html
@@ -0,0 +1,36 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+  image-rendering: -moz-crisp-edges;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..7029cc7091
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,36 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+  /* XXX image-rendering: -moz-crisp-edges; */
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..3574bf501c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+  /* XXX image-rendering: -moz-crisp-edges; */
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..a46ace1e65
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..38ff1e6d0c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..f68cc62f9a
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..87128908f8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..b0be12e5f1
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..a560625f83
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..6d77c6844e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..e00cfed975
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..fefb927752
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height.html
new file mode 100644
index 0000000000..c9b8006b4f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..8549f85b5e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..7734a3b4fe
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..2be708373e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height.html
new file mode 100644
index 0000000000..1bd5b3cf24
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..e87ba6ba6f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height.html
new file mode 100644
index 0000000000..4930568ebe
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/tall--cover--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>tall background-size: cover; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 256px; height: 768px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/template.html b/layout/reftests/backgrounds/vector/template.html
new file mode 100644
index 0000000000..65a4036367
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/template.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>TALLWIDE background-size: SIZE; for VIMAGE</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  ORIENTATION;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(VIMAGE);
+  background-repeat: no-repeat;
+  background-size: SIZE;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..3acb1471eb
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..c68bb126e2
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..5fac51f7a3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..39139bf07d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..2004537d59
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..12421f6d69
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..a735c0cfd9
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..bc020f0fca
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..169e379948
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..684d18a175
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..c2f82c36e7
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height.html
new file mode 100644
index 0000000000..6f3ddb69ac
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..0bc05e7306
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..9b4b2acc76
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..0c30c0b353
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height.html
new file mode 100644
index 0000000000..cc873a55b3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..42614c4b55
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height.html
new file mode 100644
index 0000000000..e39b610933
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--12px-auto--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: 12px auto; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: 12px auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..1cd8d94c3f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..08bd7f2564
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..71cf8f61ec
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..0ace95021a
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..e1f7f2618f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..18312be470
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..f66416b17d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..f6f2be7318
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..78f3a3a36c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..83c76cd828
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..e04a81216b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height.html
new file mode 100644
index 0000000000..99a7cd2b04
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..4e5a077551
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..355985de97
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..e259690333
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height.html
new file mode 100644
index 0000000000..70471cd700
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..2aac967a96
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height.html
new file mode 100644
index 0000000000..7d119a3720
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..f8d3da2c32
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..8bd16d110d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..4573e583a2
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..e8b20f292c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..5a1e405fbe
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..4890bc5c76
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..1d37678e43
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..a58e491aad
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..12fe975412
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..0cc08fde1b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..13de26257f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height.html
new file mode 100644
index 0000000000..d50223df67
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..1c53353495
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..9088fde48c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..8ff18c4a4b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height.html
new file mode 100644
index 0000000000..a80cfd5a66
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..a1edcd802f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height.html
new file mode 100644
index 0000000000..9f0186a520
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--auto-32px--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: auto 32px; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: auto 32px;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..e31e2e00c2
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..c3578b0619
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..2f96d08ddc
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..bfe7b03358
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..d12e35c98f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..3e098fa36d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..11dc154351
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..0c4ed8af5b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..7183a07b98
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..b50a442940
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..b4dd27945d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height.html
new file mode 100644
index 0000000000..642f26cc9d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..80e3381546
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..bf6a42b2a8
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..98ca31c88b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height.html
new file mode 100644
index 0000000000..22325f2706
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..33cf379678
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height.html
new file mode 100644
index 0000000000..2347d35d67
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--contain--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: contain; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: contain;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..bab00d6b91
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height.html
new file mode 100644
index 0000000000..ab7ecd975a
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..ba6395a0b6
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height.html
new file mode 100644
index 0000000000..c48b1c447e
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..e43de25707
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height.html
new file mode 100644
index 0000000000..70e1abce0c
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--nonpercent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for nonpercent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(nonpercent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..6095500e1f
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height.html
new file mode 100644
index 0000000000..8da880e776
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..328284f18d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height.html
new file mode 100644
index 0000000000..b269803595
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..3957178704
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height.html
new file mode 100644
index 0000000000..4133a7ba62
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--omitted-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for omitted-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(omitted-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height-viewbox.html
new file mode 100644
index 0000000000..3795b93e0d
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for percent-width-nonpercent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height.html b/layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height.html
new file mode 100644
index 0000000000..fd75fedfab
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--percent-width-nonpercent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for percent-width-nonpercent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-nonpercent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height-viewbox.html
new file mode 100644
index 0000000000..71d1ede86b
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for percent-width-omitted-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height.html b/layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height.html
new file mode 100644
index 0000000000..d38969ffc3
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--percent-width-omitted-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for percent-width-omitted-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-omitted-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height-viewbox.html b/layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height-viewbox.html
new file mode 100644
index 0000000000..17da1912ad
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height-viewbox.html
@@ -0,0 +1,35 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for percent-width-percent-height-viewbox.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#ViewBoxAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height-viewbox.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
diff --git a/layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height.html b/layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height.html
new file mode 100644
index 0000000000..f688223fb4
--- /dev/null
+++ b/layout/reftests/backgrounds/vector/wide--cover--percent-width-percent-height.html
@@ -0,0 +1,34 @@
+<!--
+     Any copyright is dedicated to the Public Domain.
+     http://creativecommons.org/publicdomain/zero/1.0/
+-->
+<!DOCTYPE html>
+<html>
+<head>
+  <title>wide background-size: cover; for percent-width-percent-height.svg</title>
+  <link rel="author" title="Jeff Walden" href="http://whereswalden.com/" />
+  <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#IntrinsicSizing" />
+  <link rel="help" href="http://www.w3.org/TR/SVG/coords.html#PreserveAspectRatioAttribute" />
+  <meta name="flags" content="svg" />
+  <style type="text/css">
+div
+{
+  width: 768px; height: 256px;
+}
+#outer
+{
+  border: 1px solid black;
+}
+#inner
+{
+  background-image: url(percent-width-percent-height.svg);
+  background-repeat: no-repeat;
+  background-size: cover;
+}
+  </style>
+</head>
+<body>
+<div id="outer"><div id="inner"></div></div>
+</body>
+</html>
-- 
cgit v1.2.3