Question

I have 31 div with the same class “.cal”. Is there any way to detect each div and if one (or many other) div do have overflow, the browser automatically add a html content remind users that this div is overflowed?

I know I should check clientHeight

Answer 1

Using jquery:

$(".cal").each(function(i){
    if ($(this).css("overflow") === "hidden") {
        $(this).html("Overflow");
    }
});

EDIT @JoJo explained me what I’ve missed from your description. So just put an inner wrapper into your .cal div and get height and width of the wrapper instead. If inner wrapper is larger than your .cal then the block is overflown. Proof of concept on jsfiddle