Monday, 2 December 2019

Calculate div height given a known width?

I have a div that contains a picture and some text (the image is of the variable size and the text is of the variable length).
Is there any way to calculate the height required to fit all the div content, given that the exact width is predefined?

UPD getting same wrong result when using $(document).ready()

document.addEventListener("DOMContentLoaded", function ()
{
                var div = document.getElementById("Content");
                var res = document.getElementById("Result");

                res.innerHTML = div.offsetHeight; // incorrect - returns 252 while the real height is 360 (Firefox, Chrome)
});
div
        {
                width: 400px;
        }

        img
        {
                float: left;
                margin: 0.5em;
}
<div id="Content">

        <img src="https://picsum.photos/id/82/200/150" />

        Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Orci phasellus egestas tellus rutrum. Tempor nec feugiat nisl pretium fusce. Cras pulvinar mattis nunc sed blandit libero volutpat sed cras. Purus sit amet luctus venenatis lectus magna fringilla urna. Ut tristique et egestas quis. Mauris cursus mattis molestie a iaculis at erat pellentesque adipiscing. Iaculis eu non diam phasellus vestibulum lorem sed risus ultricies. Semper quis lectus nulla at. Augue interdum velit euismod in. Amet aliquam id diam maecenas ultricies mi eget. Scelerisque viverra mauris in aliquam sem fringilla ut morbi. Et egestas quis ipsum suspendisse. Et malesuada fames ac turpis. Fermentum iaculis eu non diam phasellus vestibulum lorem sed.

</div>
<br/>
<span id="Result"></span>


from Calculate div height given a known width?

No comments:

Post a Comment