calc-rounding-001.html (939B)
1 <!doctype html> 2 <!-- 3 Any copyright is dedicated to the Public Domain. 4 http://creativecommons.org/publicdomain/zero/1.0/ 5 --> 6 <meta charset="utf-8"> 7 <title>CSS Test: calc rounding doesn't accumulate a lot of error.</title> 8 <link rel="author" href="mailto:mats@mozilla.com" title="Mats Palmgren"> 9 <link rel="author" href="mailto:emilio@crisal.io" title="Emilio Cobos Álvarez"> 10 <link rel="help" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1323735"> 11 <link rel="help" href="https://drafts.csswg.org/css-values/#funcdef-calc"> 12 <link rel="match" href="calc-rounding-001-ref.html"> 13 <style> 14 body { 15 background: #f3f5f6; 16 } 17 18 div { 19 font-size: 15px; 20 width: 401px; 21 margin: 20px; 22 background: #fff; 23 display: flex; 24 flex-wrap: wrap; 25 } 26 27 b { 28 height: 50px; 29 background: red; 30 width: calc((100% - 4.5em) / 4); /* .5em gutters */ 31 } 32 33 b:not(:last-child) { 34 margin-right: 1.5em; 35 } 36 </style> 37 <div><b></b><b></b><b></b><b></b></div>