Financial-Times
o-message: Incorrect alignment of iconography with non-16px root font-size
o-message alert icon alignment appears to be off when used on ft.com.
The below screenshot shows the error alert, the icon is a little too high.
This is because ft.com set font-size: .8125em; on the html element
and the positioning of the icon is a little... interesting. It's absolute and
combines a number of "magic" px and rem values.
o-message should be updated to respond to custom font-sizes, which may be set by projects or by the user in their browser settings.
o-message should be updated to respond to custom font-sizes, which may be set by projects or by the user in their browser settings.
Origami already supports relative units with the following variables.
$o-typography-relative-units: true;
$o-spacing-relative-units : true;
The issue here is the mix of px and relative units when:
- relative units haven't been enabled
- 16px is not the base font size