JSFiddle - React, Tailwind, and code Playground

by vasi_32

HTML

<div id="height"></div>
  <div id="container" style="min-height:100vh">
    <div class="child cc">
    <p>Some </br> </br>  text here</p>
    </div>
    <div class="another-child cc">
      <p>Some text here</p>
    </div>

<span class="another-child cc">
      <p>Some text here</p>
    </span>
</div>

CSS

p{
	margin:0px;
	}

JavaScript

var cc = 0;
    $("#container > .cc").each(function(){
    var getDisplay = $(this).attr('dipslay')
      // if(){
        getDisplay !=='inline'? (cc += $(this).outerHeight()) :0;
        //}
    });
$('#height').append('<p>'+ cc+'</p>' );