Tutorials Bugs Masterclass Free stuff Test pages Proposals

Core tests

Advanced tests

This test

RichInStyle.com test pages: text - word-spacing

  1. This should have a lot of word spacing.

  2. This should have an equal amount of word spacing.

    The element above has text-align: justify; letter-spacing: 0; word-spacing: 50px. Letter-spacing: 0 serves to suppress kerning adjustment for justification purposes. Justification suppresses word spacing, but since it doesn't cover one line, it should not be justified and therefore the word-spacing should be the same as the element above it.

  3. The word here: word should have 50 pixels of space on either side (testing that the browser checks outside the element to see whether it is a word).
  4. Not so the word here: word - the element isn't a whole word.
  5. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.

    The element above should look precisely the same as that below (text-align: justify; letter-spacing: 0; word-spacing: 50px on the one above; letter-spacing: 0 suppresses kerning adjustment, and justification means that word spacing must be disregarded).

    The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog. The quick brown fox jumps over the lazy dog.