<!DOCTYPE html>
<html>
<head>
<link rel="author" title="Sammy Gill" href="mailto:sammy.gill@apple.com">
<link rel="help" href="https://drafts.csswg.org/css-box-4/#margin-trim-block">
<title>margin-trim: block-container-overflowing-float-margins-trimmed-at-final-position-block-layout</title>
<meta name="assert" content="the third float should be able to sit right under the first float with its margins trimmed">
<style>
.container {
    width: 100px;
    margin-trim: inline;
}
</style>
</head>
<body>
<div class="container">
  <div style="width: 100px; height: 50px; background-color: green"></div>
  <div style="width: 25px; height: 50px; float: left; background-color: blue; margin-inline-start: 20px;"></div>
  <div style="width: 25px; height: 50px; float: right; height: 80px; background-color: red; margin-inline-end: 20px;"></div>
  <div style="width: 25px; height: 50px; float: left; background-color: purple; margin-inline-start: 80px;"></div>
</div>
</body>
</html>
