JSFiddle - React, Tailwind, and code Playground
HTML
<div id="container">
<div id="centered-item">
<div id="positioned-item">
</div>
</div>
</div>
<pre>
This bug is visible in Firefox.
The blue box should have a 'left' value of 100px, but due to the
rounding to fix ticket #5280, it gets the incorrect value 100.5px
</pre>
CSS
#container {
position: relative;
background: red;
width: 575px;
}
#centered-item {
position: relative;
background: green;
width: 150px;
height: 100px;
margin: auto;
}
#positioned-item {
position: relative;
background: blue;
width: 50px;
height: 50px;
}
JavaScript
$('#positioned-item').position({
of: $('#centered-item'),
at: 'right bottom',
my: 'right bottom',
offset: '0 0',
collision: 'none none'
});