Stretching and resize a div dynamically

Question

I am trying to stretch div as soon as some text is loaded.I am able to do that by giving min-height:140 px and height:100% to its parent container. But content in my div is crossing its parent container. How can I limit the inner div so that it will not cross its parent container.

Please help me as I am trying for it from so long.

thanks in advance

HP

Answer 1

Use the overflow attribute in your CSS.

#myDiv {
    overflow:auto;
}

Depending on the width you assign, this will get the nested div to display a scrollbar once it's width exceeds that of its parent.

Answer 2

Every single element on a page is a rectangular box. The sizing, positioning, and behavior of these boxes can all be controlled via CSS. By behavior, I mean how the box handles it when the content inside and around it changes. For example, if you don't set the height of a box, the height of that box will grow as large as it needs to be to accommodate the content. But what happens when you do set a specific height or width on a box, and the content inside cannot fit? That is where the CSS overflow property comes in, allowing you to specify how you would like that handled.

overflow:auto;

Reference

w3schools
css tricks