Body line-height overriding footer line-height (even with Important)

[SGriffinKatzcy]

Hi. In the footer of http://cylera-7852770.hs-sites.com we have a few text modules (the 3 sentences of text: "Cylera is a..." "It's time to see..." and "Together we can...") that have an inline style rule of "line-height: 19px !important". For some reason, the line height says it's 19px, but when using Chrome's dev tools to adjust it, the height doesn't change until I increase it to 23px. So it's actually displaying as 22px, which is the default body line-height. If we have rules that are overriding that default value, why is the size still rendering as the body's default 22px?

[Kevin-C · Accepted solution]

Hey @SGriffinKatzcy 

This is being caused by a lesser known CSS rule similar to inheritance.

Because the SPAN tag is an inline element its line-height cannot be lower than its block level parent, the div.

You will see that the parent div has a line-height of 22px, thus you can't go below that size.

Hope that makes sense!