chromium/src/third_party/blink/web_tests/external/wpt/css/css-flexbox/reference/flex-flexitem-childmargin-ref.html - manifest_repos/chromium_src - Git at Google

 <!DOCTYPE html>
 <html>
 <head>
     <title>CSS Test: childNodes' 'margin' property of flex item'</title>
     <link rel="author" title="Shaofei Cheng" href="mailto:csf178@gmail.com" />
     <meta name="flags" content="" />
     <style>
     #test
     {
         background: blue;
         display: block;
         height:300px;
         position:relative;
     }
     #test>div.flex {
         width: 100px;
         background:red;
     }
     #test>div.fixed
     {
         height: 300px;
         flex:1;
         background:red;
     }
     #test p
     {
         margin:200px 0 0 0;
     }
     </style>

 </head>
 <body>
 <div id="test">
     <div class="fixed">
         <p style="width:100px;height:100px;background:orange;position:absolute;left:0px;bottom:0px;">
         a
         </p>
     </div>
     <div class="flex">
         <p style="width:100px;height:100px;background:green;position:absolute;right:0px;bottom:0px;">
         b
         </p>
     </div>
 </div>
 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>CSS Test: childNodes' 'margin' property of flex item'</title>
	<link rel="author" title="Shaofei Cheng" href="mailto:csf178@gmail.com" />
	<meta name="flags" content="" />
	<style>
	#test
	{
	background: blue;
	display: block;
	height:300px;
	position:relative;
	}
	#test>div.flex {
	width: 100px;
	background:red;
	}
	#test>div.fixed
	{
	height: 300px;
	flex:1;
	background:red;
	}
	#test p
	{
	margin:200px 0 0 0;
	}
	</style>

	</head>
	<body>
	<div id="test">
	<div class="fixed">
	<p style="width:100px;height:100px;background:orange;position:absolute;left:0px;bottom:0px;">
	a
	</p>
	</div>
	<div class="flex">
	<p style="width:100px;height:100px;background:green;position:absolute;right:0px;bottom:0px;">
	b
	</p>
	</div>
	</div>
	</body>
	</html>