| OLD | NEW |
|---|
| (Empty) |
| 1 <!doctype html> | |
| 2 <head> | |
| 3 <style> | |
| 4 div { border:5px solid maroon; -webkit-column-count:2; width:750px; margin: 1em
0 } | |
| 5 span.nested { display:block; background-color: black; color:white; margin:1em 0
} | |
| 6 span.nested:hover { background-color:#404040 } | |
| 7 h2 { -webkit-column-span: all; background-color:#eeeeee; color:black } | |
| 8 </style> | |
| 9 </head> | |
| 10 <body> | |
| 11 | |
| 12 <div> | |
| 13 <span class="nested"> | |
| 14 <h2>This is a spanning element at the beginning of the columns block.</h2> | |
| 15 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 16 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 17 </span> | |
| 18 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 19 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 20 | |
| 21 | |
| 22 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 23 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 24 | |
| 25 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. | |
| 26 </div> | |
| 27 </span> | |
| 28 <div> | |
| 29 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 30 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 31 | |
| 32 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 33 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 34 | |
| 35 <span class="nested"> | |
| 36 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 37 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 38 | |
| 39 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. | |
| 40 <h2>This is a spanning element at the end of the columns block.</h2> | |
| 41 </span> | |
| 42 </div> | |
| 43 | |
| 44 | |
| 45 <div> | |
| 46 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 47 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 48 | |
| 49 <span class="nested"> | |
| 50 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. | |
| 51 <h2>This is a spanning element in the middle of the columns block.</h2> | |
| 52 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 53 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 54 </span> | |
| 55 | |
| 56 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 57 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 58 | |
| 59 </div> | |
| 60 <!-- | |
| 61 <div> | |
| 62 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 63 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 64 | |
| 65 <span class="nested"> | |
| 66 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. | |
| 67 <h2 style="display:inline">This is a spanning element with an original display o
f inline in the middle of the columns block.</h2> | |
| 68 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 69 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 70 </span> | |
| 71 | |
| 72 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 73 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 74 | |
| 75 | |
| 76 | |
| 77 </div> | |
| 78 | |
| 79 <div> | |
| 80 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 81 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 82 | |
| 83 <span class="nested"> | |
| 84 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. | |
| 85 <h2 style="float:left">This element specifies a column span, but it is also floa
ting, so the column-span should be ignored.</h2> | |
| 86 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 87 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 88 </span> | |
| 89 | |
| 90 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 91 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 92 </div> | |
| 93 | |
| 94 | |
| 95 <div> | |
| 96 <span class="nested"> | |
| 97 <h2>This is a spanning element at the beginning of the columns block with block
siblings.</h2> | |
| 98 | |
| 99 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim a
c mi. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem.
Proin nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis v
el orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nulla
m bibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis,
interdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 100 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 101 </p> | |
| 102 </span> | |
| 103 <p> | |
| 104 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 105 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 106 </p> | |
| 107 <p> | |
| 108 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 109 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 110 </p> | |
| 111 | |
| 112 </div> | |
| 113 | |
| 114 <div> | |
| 115 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim a
c mi. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem.
Proin nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis v
el orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nulla
m bibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis,
interdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 116 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 117 </p> | |
| 118 <p> | |
| 119 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 120 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 121 </p> | |
| 122 <span class="nested"> | |
| 123 <p> | |
| 124 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 125 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 126 </p> | |
| 127 | |
| 128 <h2>This is a spanning element at the end of the columns block with block siblin
gs.</h2> | |
| 129 </span> | |
| 130 </div> | |
| 131 | |
| 132 <div> | |
| 133 <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim a
c mi. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem.
Proin nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis v
el orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nulla
m bibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis,
interdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 134 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 135 </p> | |
| 136 <span class="nested"> | |
| 137 <p> | |
| 138 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 139 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 140 </p> | |
| 141 | |
| 142 <h2>This is a spanning element in the middle of the columns block with block sib
lings.</h2> | |
| 143 | |
| 144 <p> | |
| 145 Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac m
i. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Pro
in nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel
orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam b
ibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, int
erdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. | |
| 146 Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit. | |
| 147 </p> | |
| 148 </span> | |
| 149 </div> | |
| 150 | |
| 151 --> | |
| 152 </body> | |
| 153 </html> | |
| OLD | NEW |
|---|
Chromium Code Reviews
Issue 1143153006:
Remove old multicol tests that were only run with the old implementation. (Closed)
Base URL: svn://svn.chromium.org/blink/trunk