LayoutTests/fast/css-grid-layout/fixed-width-intrinsic-width-should-exclude-scrollbar-width-in-grid.html - WebKit - Git at Google

 <!DOCTYPE html>
 <html>
 <link href="resources/grid.css" rel="stylesheet">
 <style>
 .grid {
     grid-template-columns: 400px 500px;
     grid-template-rows: 200px 300px;
 }

 .gridItemScrollOverflow {
     width: 50px;
     height: 50px;
     overflow: scroll;
 }

 </style>
 <script src="../../resources/check-layout.js"></script>
 <body onload="checkLayout('.grid')">

 <p>This test checks that scrollbar width should not be added to the width of fixed-width grid items.</p>

 <div class="grid">
     <div class="firstRowFirstColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
     <div class="firstRowSecondColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
     <div class="secondRowFirstColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
     <!-- Grid item itself being a grid container-->
     <div class="grid secondRowSecondColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
 </div>

 </body>
 </html>
	<!DOCTYPE html>
	<html>
	<link href="resources/grid.css" rel="stylesheet">
	<style>
	.grid {
	grid-template-columns: 400px 500px;
	grid-template-rows: 200px 300px;
	}

	.gridItemScrollOverflow {
	width: 50px;
	height: 50px;
	overflow: scroll;
	}

	</style>
	<script src="../../resources/check-layout.js"></script>
	<body onload="checkLayout('.grid')">

	<p>This test checks that scrollbar width should not be added to the width of fixed-width grid items.</p>

	<div class="grid">
	<div class="firstRowFirstColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
	<div class="firstRowSecondColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
	<div class="secondRowFirstColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
	<!-- Grid item itself being a grid container-->
	<div class="grid secondRowSecondColumn gridItemScrollOverflow" data-expected-width="50" data-expected-height="50"></div>
	</div>

	</body>
	</html>