Get your own website Result Size: 625 x 565
x
 
<!DOCTYPE html>
<html>
<head>
<style>
div {
  display: flex;
  gap: 20px;
}
div.box {
  width: 100px;
  height: 100px;
  background: beige;
  padding: 5px;
}
div.box2 {
  height: round(up, 105px, 25px);
}
div.box3 {
  height: round(down, 120px, 25px;
}
div.box4 {
  height: round(to-zero, 115px, 25px);
}
</style>
</head>
<body>
<h1>The round() function</h1>
<p>Here, the round() function is used to set the height of the last four divs. The value to be rounded is between 100 px and 125 px in each case, and the rounding interval is 25px in all cases. The height of the boxes below is therefore either rounded up to 125 px or down to 100 px.</p>
<p>The first div will have a height of 100px.</p>
<div>
<div class="box">height: 100px</div>
<div class="box box2">round up 105px (height will be 125px)</div>
<div class="box box3">round down 120px (height will be 100px)</div>
<div class="box box4">round to-zero 115px (height will be 100px)</div>
</div>