LayoutTests/fast/shapes/shape-inside/shape-inside-multiple-blocks-vertical.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
 <style>
     .shape-inside {
         width: 200px;
         height: 300px;
         -webkit-shape-inside: polygon(10px 15px, 180px 15px, 180px 295px, 10px 295px);
         position: relative;
     }
     .rl { -webkit-writing-mode: vertical-rl; }
     .lr { -webkit-writing-mode: vertical-lr; }
     .border {
         position: absolute;
         top: 13px;
         left: 8px;
         width: 170px;
         height: 280px;
         border: 2px solid blue;
     }
     p { -webkit-margin-before: 0; }
 </style>
 </head>
 <body>
     <div class="shape-inside rl">
         <div class="border"></div>
         <div>
             <p>Paragraph 1. This paragraph should start at the top right corner of the blue
             rectangle. Its top and bottom edges should be within the blue rectangle.
         </div>
         <p>Paragraph 2. This paragraph should be to the left of paragraph 1. Its top
         and bottom edges should also be within the blue rectangle.
     </div>
     <div class="shape-inside lr">
         <div class="border"></div>
         <div>
             <p>Paragraph 1. This paragraph should start at the top left corner of the blue
             rectangle. Its top and bottom edges should be within the blue rectangle.
         </div>
         <p>Paragraph 2. This paragraph should be to the right of paragraph 1. Its top
         and bottom edges should also be within the blue rectangle.
     </div>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<style>
	.shape-inside {
	width: 200px;
	height: 300px;
	-webkit-shape-inside: polygon(10px 15px, 180px 15px, 180px 295px, 10px 295px);
	position: relative;
	}
	.rl { -webkit-writing-mode: vertical-rl; }
	.lr { -webkit-writing-mode: vertical-lr; }
	.border {
	position: absolute;
	top: 13px;
	left: 8px;
	width: 170px;
	height: 280px;
	border: 2px solid blue;
	}
	p { -webkit-margin-before: 0; }
	</style>
	</head>
	<body>
	<div class="shape-inside rl">
	<div class="border"></div>
	<div>
	<p>Paragraph 1. This paragraph should start at the top right corner of the blue
	rectangle. Its top and bottom edges should be within the blue rectangle.
	</div>
	<p>Paragraph 2. This paragraph should be to the left of paragraph 1. Its top
	and bottom edges should also be within the blue rectangle.
	</div>
	<div class="shape-inside lr">
	<div class="border"></div>
	<div>
	<p>Paragraph 1. This paragraph should start at the top left corner of the blue
	rectangle. Its top and bottom edges should be within the blue rectangle.
	</div>
	<p>Paragraph 2. This paragraph should be to the right of paragraph 1. Its top
	and bottom edges should also be within the blue rectangle.
	</div>
	</body>
	</html>