Firefox returns the pixel value, Chrome returns the percentage value (maximum CSS height)

I am trying (via jQuery) to get the maximum height of a set of divs via CSS as a percentage (45%).

In Firefox, it returns the pixel value, but in Chrome / Safari, the value is returned as a percentage (45%). The jQuery code I use to get these values:

parseInt($('.content-section').css('max-height')) 

Am I doing it wrong? How do I get pixel heights in Chrome / Safari? Or even, percentage height in Firefox?

EDIT:

Original CSS: .content-section {width: 880px; margin: 0 auto; max-height: 45%}

Computed CSS in chrome: Chrome computed

Computed CSS in Firebug: Firebug computed

+6
source share
1 answer

Hmm, this is strange. One way is to use a percentage to calculate the actual maximum height. For instance:

 var percentage = parseInt($('div.container').css('max-height')); //40? var parentHeight = $('div.container').parent.height(); // ie 1000 (this is a px value) var pixelHeight = parentHeight/percantage; // 400 

Not sure what the code looks like, so this, of course, may not work as it is written. In addition, you will only need to do this for browsers for which it works funky!

0
source

Source: https://habr.com/ru/post/976758/


All Articles