chromium/src/third_party/blink/web_tests/fast/multicol/vertical-lr/rules-with-border-before.html - manifest_repos/chromium_src - Git at Google

 <!DOCTYPE html>
 <style>
     .test {
         width: 100px;
         height: 100px;
         -webkit-writing-mode: vertical-lr;
         -webkit-columns: 2;
         -webkit-column-rule: 50px solid orange;
         -webkit-column-gap: 50px;
     }

     .before { border-block-start: 50px solid blue; }
     .after { border-block-end: 50px solid blue; }

     .test div { width: 200px; }
 </style>
 <p>There should be a 50px blue border to the left of an orange rectangle:</p>
 <div class="test before"><div></div></div>
 <p>There should be a 50px blue border to the right of an orange rectangle:</p>
 <div class="test after"><div></div></div>
	<!DOCTYPE html>
	<style>
	.test {
	width: 100px;
	height: 100px;
	-webkit-writing-mode: vertical-lr;
	-webkit-columns: 2;
	-webkit-column-rule: 50px solid orange;
	-webkit-column-gap: 50px;
	}

	.before { border-block-start: 50px solid blue; }
	.after { border-block-end: 50px solid blue; }

	.test div { width: 200px; }
	</style>
	<p>There should be a 50px blue border to the left of an orange rectangle:</p>
	<div class="test before"><div></div></div>
	<p>There should be a 50px blue border to the right of an orange rectangle:</p>
	<div class="test after"><div></div></div>