Tutorials Bugs Masterclass Free stuff Test pages Proposals

Core tests

Advanced tests

This test

RichInStyle.com tests: background-repeat

Basic test

  1. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line. Some text that should have the background repeated in a horizontal line.

  2. Some text that should have the background repeated in a vertical line. Some text that should have the background repeated in a vertical line. Some text that should have the background repeated in a vertical line. Some text that should have the background repeated in a vertical line. Some text that should have the background repeated in a vertical line. Some text that should have the background repeated in a vertical line.

  3. Some text that should have the background placed once only. Some text that should have the background placed once only. Some text that should have the background placed once only. Some text that should have the background placed once only. Some text that should have the background placed once only. Some text that should have the background placed once only. Some text that should have the background placed once only. Some text that should have the background placed once only.

  4. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element. Some text that should have the background placed over the whole element.

Width/height of image exceeds required space test

  1. A background image

    Spacer

    Spacer

    Spacer

    The image above should be the same width and height as its content - it should not spill out of the element.

  2. A b c d e f g

    The image above should only cover the width of the text - it should not be this width:

Background-repeat longhand test

  1. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once. This should have the background placed just once.

Inline element background-repeat test

  1. This should have a background repeated horizontally. Since the background goes behind font size and since the line box is much taller than that, it should be repeated horizontally, line by line.

  2. This should have a background repeated vertically. Since the background goes behind font size and since the line box is much taller than that, it should be repeated horizontally, line by line.

  3. This should have a background repeated only once. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text. Here's some text.