Fix a couple of sub-pixel precision issues in the review request page.

Review Request #12226 — Created April 1, 2022 and submitted

Information

Review Board
release-4.0.x

Reviewers

When editing a field in the review request page, the boundaries of the
edit box would raise up by a fraction of a pixel in Firefox, and could
raise by a full pixel in Chrome. This was most noticeable when zooming
into the page.

This problem was caused by the field label and the edit icon's vertical
alignment. The icon was aligned at the baseline, which would change when
showing or hiding the icon. This led to a small change in the height of
the label area, causing the editor to shift.

We now set an explicit vertical-align: top on the icon, helping ensure
a stable bounding rectangle and therefore height.

We also ensure that #review-request-main always has an integer height,
in order to avoid other subtle sub-pixel issues that could impact
layout and offset calculations.

Zoomed far into the browser and toggled the edit state of different
fields, making sure that the top-left boundaries remained fixed in
place.

Summary ID
Fix a couple of sub-pixel precision issues in the review request page.
When editing a field in the review request page, the boundaries of the edit box would raise up by a fraction of a pixel in Firefox, and could raise by a full pixel in Chrome. This was most noticeable when zooming into the page. This problem was caused by the field label and the edit icon's vertical alignment. The icon was aligned at the baseline, which would change when showing or hiding the icon. This led to a small change in the height of the label area, causing the editor to shift. We now set an explicit `vertical-align: top` on the icon, helping ensure a stable bounding rectangle and therefore height. We also ensure that `#review-request-main` always has an integer height, in order to avoid other subtle sub-pixel issues that could impact layout and offset calculations.
a654005dfed39c3ed7c6092ca2b56ee3b7873c03
david
  1. Ship It!
  2. 
      
chipx86
Review request changed
Status:
Completed
Change Summary:
Pushed to release-4.0.x (ef84ea3)