How to Fix the Line Height Unit being converted to “EM”?

Before the release of Astra theme version 4.0.0, the line-height, was set using a unit-less approach. This means that the line-height value appeared without any particular unit of measurement.

However, with the update to version 4.0.0, there was a change in how the line-height was handled. It was explicitly set to “em” by default. “em” is a unit of measurement relative to the font size. This change might have caused compatibility issues for users who were accustomed to the previous unit-less approach.

To address this issue and provide a solution for users, our developers introduced a new filter. This filter allows users to adjust the line-height to their desired unit. By utilizing the filter, users can specify the unit they prefer for line-height, such as px, em, rem or specify an empty value (“”) to apply the “unit-less” approach. Read more about the Line-height unit here.

To fix this issue, please copy the code below and paste it into the function.php of the child theme of your website.

add_filter( 'astra_font_line_height_unit', 'my_custom_font_extras_unit' );
function my_custom_font_extras_unit( $unit ) {
	// Set to empty string for a unit-less value or "em" or "px".
	$modified_unit = '';
	return $modified_unit;
}

If you are not sure about the child theme of the Astra theme, here is an article that will guide you. Here is another article that will guide you on how to insert this code into your child theme’s function.php.

We strongly recommend you to take a backup of your website before editing the function.php file of your website. Here is another article that will guide you through the process of taking a backup of your website.