RichInStyle.com
 Tutorials Bugs Masterclass Free stuff Test pages Proposals

Core tests
Attaching style Applying style Key concepts Color and background Fonts Text Lists Box model

Advanced tests
Positioning Boxes Generated content Dynamic effects Tables Paged media @font-face Aural styles Language styles

This test
ID ID grouping ID validity CLASSes Class grouping CLASS validity
Multiple CLASSes Multiple CLASSes 2 Case Universal Attribute Type
Contains Dash match Links Dynamic Dynamic 2 Combinations :first-child
:first-letter :first-line Descendants Children Adjacent Adjacent 2

RichInStyle.com tests: :first-letter

  1. T his should not have a vast space after the first letter. (letter-spacing is inapplicable) This should look normal. This should look normal. This should look normal. This should look normal.

  2. T his should not have a vast space after the first letter. (word-spacing) This should look normal. This should look normal. This should look normal.

  3. This first letter should be red.

  4. This first letter should be floated

  5. "The first two glyphs should be red.

  6. The first letter should be superscripted.

  7. The first letter should not be red (block elements only).

  8. This first letter should have left and right margins (only).

  9. This should be huge.

  10. This first letter should be bordered in red.

  11. This first letter should have left and right padding.

  12. This should have a huge line-height.

  13. The first letter of this P element should not be red (P.r:first-letter SPAN {color: red})

  14. This should have a red background on its first letter.

  15. The picture is here:

  16. This should be flowing round the image, despite what CSS says to the contrary - clear has no effect on inline elements.

  17. This is a test of whether the UA treats the first letter of LI correctly. The 'T' should be red.

  18.  This element has a non-breaking space as its first letter. Therefore the 'T' shouldn't be red.

:first-letter and :first-line combinations

  1. The first letter of this P element should be not be red since :first-line:first-letter is not valid.

Position of pseudo-element test

  1. The first letter should not be red (pseudo-element before class).

  2. However, this element should be red, because the selector was grammatically correct, and so therefore there is no reason to ignore the ruleset.

  3. The first letter of this should be red, thanks to a class, id and pseudo-element all combining.

Copyright © RichInStyle.com 2000; all rights reserved. See copyright document for terms of use. Please visit Bukit Lawang flood appeal.