blob: de756b4053f76b7fae8ec92468ba7dec5bca4f31 [file] [log] [blame] [edit]
<style>
div {
width: 80px;
word-break: break-all;
}
.inline-block {
display: inline-block;
width: 20px;
height: 20px;
background-color: blue;
}
</style>
<div id=text_container>some text content</div>
<div id=mixed_container>some <div class=inline-block></div> and more</div>
<script>
document.body.offsetHeight;
text_container.appendChild(document.createTextNode("and more"));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode(" and more"));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode("and more "));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode(" and more "));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode("and some more more"));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode("and more more more"));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode(" and more more more more more "));
document.body.offsetHeight;
text_container.appendChild(document.createTextNode("and this last one."));
function createInlineBlock() {
let inline_block = document.createElement("div");
inline_block.className = "inline-block";
return inline_block;
};
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode("and more"));
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode(" and more"));
document.body.offsetHeight;
mixed_container.appendChild(createInlineBlock());
mixed_container.appendChild(document.createTextNode("and more "));
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode(" and more "));
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode("and some more more"));
mixed_container.appendChild(createInlineBlock());
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode("and more more more"));
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode(" and more more more more more "));
mixed_container.appendChild(createInlineBlock());
document.body.offsetHeight;
mixed_container.appendChild(document.createTextNode("and this last one."));
</script>