third_party/WebKit/LayoutTests/css1/classification/display.html

   1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/REC-html40/loose.dtd">
   2 <HTML>
   3 <HEAD>
   4 <TITLE>CSS1 Test Suite: 5.6.1 display</TITLE>
   5 <META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
   6 <META http-equiv="Content-Style-Type" content="text/css">
   7
   8 <LINK rel="stylesheet" type="text/css" media="screen" href="../resources/base.css">
   9 <STYLE type="text/css">
  10 .one {display: block;}
  11 .two {display: inline;}
  12 .three {display: list-item; list-style-type: square; margin-left: 3em;}
  13 .four {display: none; color: red;}
  14 I {display: block;}</STYLE>
  15
  16 </HEAD>
  17
  18 <BODY><P>The style declarations which apply to the text below are:</P>
  19 <PRE>.one {display: block;}
  20 .two {display: inline;}
  21 .three {display: list-item; list-style-type: square; margin-left: 3em;}
  22 .four {display: none; color: red;}
  23 I {display: block;}
  24 </PRE>
  25 <HR>
  26 <P class="one">
  27 This sentence should be a block-level element.
  28 </P>
  29
  30 <P class="two">
  31 This sentence should be part of an inline element, as are the next three.
  32 </P><P class="two">
  33 This sentence and the next two are part of a second inline element.  They should therefore appear, along with the sentence above, to be all one paragraph which is four sentences long.  If this is not the case, then the keyword <CODE>inline</CODE> is being ignored.
  34 </P>
  35
  36 <P class="three">
  37 This sentence should be treated as a list-item, and therefore be rendered however this user agent displays list items (if <CODE>list-style-type</CODE> is supported, there will be a square for the item marker).  A 3em left margin has been applied in order to ensure that there is space for the list-item marker.
  38 </P>
  39
  40 <P>
  41 The next paragraph should be invisible (if it's visible, you'll see red text).
  42 </P>
  43 <P class="four">
  44 This paragraph should be invisible.
  45 </P>
  46
  47 <P>
  48 There should be no text after the colon: <SPAN class="four">fnord.</SPAN>
  49 </P>
  50
  51 <P>
  52 The italicized text <I>in this paragraph</I> should be a block-level element.
  53 </P>
  54
  55
  56 <TABLE border cellspacing="0" cellpadding="3" class="tabletest">
  57 <TR>
  58 <TD colspan="2" bgcolor="silver"><STRONG>TABLE Testing Section</STRONG></TD>
  59 </TR>
  60 <TR>
  61 <TD bgcolor="silver">&nbsp;</TD>
  62 <TD><P class="one">
  63 This sentence should be a block-level element.
  64 </P>
  65
  66 <P class="two">
  67 This sentence should be part of an inline element, as are the next three.
  68 </P><P class="two">
  69 This sentence and the next two are part of a second inline element.  They should therefore appear, along with the sentence above, to be all one paragraph which is four sentences long.  If this is not the case, then the keyword <CODE>inline</CODE> is being ignored.
  70 </P>
  71
  72 <P class="three">
  73 This sentence should be treated as a list-item, and therefore be rendered however this user agent displays list items (if <CODE>list-style-type</CODE> is supported, there will be a square for the item marker).  A 3em left margin has been applied in order to ensure that there is space for the list-item marker.
  74 </P>
  75
  76 <P>
  77 The next paragraph should be invisible (if it's visible, you'll see red text).
  78 </P>
  79 <P class="four">
  80 This paragraph should be invisible.
  81 </P>
  82
  83 <P>
  84 There should be no text after the colon: <SPAN class="four">fnord.</SPAN>
  85 </P>
  86
  87 <P>
  88 The italicized text <I>in this paragraph</I> should be a block-level element.
  89 </P>
  90 </TD></TR></TABLE></BODY>
  91 </HTML>