How to know how many pixels has a div with height: 100%? And how can I subtract a certain value from this total of pixels and apply what's left of the other div

Question

How to know how many pixels has a div with height: 100%? And how can I subtract a certain value from this total of pixels and apply what's left of the other div

Navigation

#1 by (1 votes)

0

I'm not sure how I can do this, but in my case I'd like to subtract 80 pixels from a div that has height:100% .

I've seen how to get the height of a div, but I'd like to do something that I think is more complex!

score 1 · Accepted Answer

Doing with pure javascript, which can offer you better performance, just use the clientHeight function to get the div height in pixels then apply the other div to the subtraction result:

window.onload = function () {
    var altura = document.getElementById('geral').clientHeight;
    alert(altura);
    var alturaDaOutraDiv = parseInt(altura) - 80;
    if(alturaDaOutraDiv > 0){
        document.getElementById('outra').style.height= alturaDaOutraDiv+"px";
        var alturaDaOutra = document.getElementById('outra').clientHeight;
        alert(alturaDaOutra);
    }
};

<div id="geral">
    Oi eu sou uma div com conteudo html.
    <p>Oi</p>
    <p>Oi</p>
    <p>Oi</p>
    <p>Oi</p>
    <p>Oi</p>
    <p>Oi</p>
    <p>Oi</p>
    
</div>
<div id="outra">
    conteudo da outra div
</div>

Test: link

How to know how many pixels has a div with height: 100%? And how can I subtract a certain value from this total of pixels and apply what's left of the other div

1 answer