JSFiddle - React, Tailwind, and code Playground
HTML
http://jsfiddle.net/Enn6p/7/#run<div class="outer a">
Outer A <small>(implicit height)</small><br/>
<div class="inner a">Inner A<br/><small>(implicit height)</small></div>
<div class="inner b">Inner B<br/><small>(height: 80px)</small></div>
</div>
<div class="outer b">Outer B <small>(min-height: 150px)</small></div>
<div class="clearfix"></div>
<p>P <span><small>(implicit height)</small></span></p>
<textarea rows="24"></textarea>
CSS
.outer, .inner, p {
background-color: #ddd;
padding: 10px;
}
.outer, .inner {
width: 40%;
}
.a {
float: left;
}
.b {
float: right;
}
.inner, span {
background-color: #ccc;
}
.inner.b {
height: 80px;
}
.outer.b {
min-height: 150px
}
.clearfix {
clear: both;
}
textarea {
width: 100%;
font-family: monospace;
font-size: 10px;
}
JavaScript
var $outer_a = $('.outer.a'),
$outer_b = $('.outer.b'),
$inner_a = $('.inner.a'),
$inner_b = $('.inner.b'),
$p = $('p'),
$span = $('p span'),
$ta = $('textarea');
function hasSetHeight($obj) {
var html = $obj.html();
$obj.html('');
var height = $obj.height();
$obj.html(html);
setHeight = (height > 0) ? "yes" : "no";
return setHeight;
}
function sizeDefined(obj){
var tmp = obj.clone().html('').appendTo($('body'));
var w = (tmp.width()==0 ? "no":"yes");
var h = (tmp.height()==0 ? "no":"yes");
tmp.remove();
return [w,h];
}
function log(label, message) {
$ta.append(label + ": " + message + "\n");
}
function logHeights(container_name) {
$container = eval("$" + container_name);
log(container_name + ".height()", $container.height());
log(container_name + ".css('height')", $container.css('height'));
log(container_name + ".css('min-height')", $container.css('min-height'));
log(container_name + ".css('max-height')", $container.css('max-height'));
log(container_name + " hasSetHeight?", hasSetHeight($container));
log(container_name + " sizeDefined?", sizeDefined($container)[1] + "\n");
}
logHeights('outer_a');
logHeights('outer_b');
logHeights('inner_a');
logHeights('inner_b');
logHeights('p');
logHeights('span');