| <head> |
| </head> |
| In the test below, the column rules should not be visible, since a negative z-index child is painting on top of them. You should see no red below. |
| |
| <div style="-webkit-column-count: 3; -webkit-column-rule: 4px solid red; padding: 0 30px; border:5px solid black;position:relative; z-index:0; background-color:red"> |
| <div style="position:absolute; left:0; top:0;right:0;bottom:0; z-index:-1; background-color:#eeeeee"></div> |
| Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nulla varius enim ac mi. Curabitur sollicitudin felis quis lectus. Quisque adipiscing rhoncus sem. Proin nulla purus, vulputate vel, varius ut, euismod et, nisi. Sed vitae felis vel orci sagittis aliquam. Cras convallis adipiscing sem. Nam nonummy enim. Nullam bibendum lobortis neque. Vestibulum velit orci, tempus euismod, pretium quis, interdum vitae, nulla. Phasellus eget ante et tortor condimentum vestibulum. |
| Suspendisse hendrerit quam nec felis. Sed varius turpis vitae pede. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Proin bibendum justo ac enim. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. Sed leo nulla, rutrum eu, dictum ut, posuere vel, arcu. Nam libero. Morbi orci. Maecenas pellentesque. Curabitur erat erat, ullamcorper at, gravida vitae, iaculis vitae, elit. Nullam quam. Quisque orci lectus, ullamcorper eu, imperdiet sed, accumsan et, ligula. Duis diam nisl, sagittis a, blandit volutpat, interdum sed, velit. Vestibulum quam. |
| Nulla a purus. Phasellus semper semper lectus. Nulla porttitor, dolor dictum scelerisque luctus, velit ipsum lobortis mauris, ac pretium enim nunc vel risus. Proin gravida mi ut sem cursus mattis. Fusce laoreet, nisi quis luctus volutpat, arcu pede tincidunt enim, nec malesuada urna nisl eu enim. Vivamus varius augue ac purus. Vestibulum vestibulum. Phasellus et est vitae ante accumsan rhoncus. Morbi convallis, arcu at hendrerit gravida, sem diam dignissim risus, sed aliquet erat mi ut mi. Nunc cursus lacinia elit. |
| Nunc nisi. Quisque at erat. Vestibulum dictum quam vitae nibh. Nunc vitae ante non odio interdum blandit. Curabitur leo quam, fermentum sed, feugiat in, ullamcorper id, nibh. Suspendisse ac turpis. In iaculis sollicitudin dui. Aenean vitae lectus vitae nulla pellentesque sollicitudin. Nunc gravida pharetra lectus. Etiam lacus ligula, placerat ut, dictum vitae, tempus vel, risus. Cras rhoncus. Praesent varius ultricies orci. Donec mattis, neque ut ornare fringilla, ante urna placerat eros, vel commodo nisi tortor ut mauris. Morbi magna dui, sagittis sit amet, tincidunt et, elementum eget, quam. Fusce molestie nisl vitae nisi. |
| Vestibulum a sapien. Phasellus ante lacus, vehicula non, cursus a, tempor ut, magna. Suspendisse potenti. Fusce aliquet, odio viverra vulputate dictum, enim odio luctus purus, ut scelerisque quam nulla non est. Donec eros lacus, egestas vitae, lacinia quis, tempor quis, pede. Morbi orci erat, iaculis id, ornare ac, elementum at, sem. Nunc ornare sodales nisi. Morbi interdum commodo nisl. Fusce eget eros non nisi ornare facilisis. Sed placerat, est non posuere posuere, purus sem dignissim libero, a viverra tellus dolor vel lorem. Cras augue. Etiam ultricies consequat odio. Mauris ac libero. Etiam posuere, libero vitae euismod gravida, urna elit imperdiet magna, vel cursus elit felis non mauris. Donec orci erat, porta id, dignissim ut, posuere dictum, leo. Suspendisse scelerisque egestas nulla. |
| </div> |