Search code examples
htmlcssoverflowcrop

showing the bottom of the div content with overflow hidden

basically i got a div with a lot of content, like:

<div>
top of content </br>
some content </br>
some  content </br>
some  content </br>
some  content </br>
some  content </br>
some  content </br>
some  content </br>
bottom of content 
</div>

then, im setting a height for the div, and overflow, so it will "crop" the div. like this:

<style>
div{
height:100px;
overflow:hidden;
}
</style>

what i'd like to do, is that the div will show the end of the content, not the top of it.

Thanks!

Solution

  • give an id to your div (e.g. "myDiv") and then by javascript try:

    document.getElementById("myDiv").scrollTop = document.getElementById("myDiv").scrollHeight;