How to make a large block inside a small one so that the big one does not go beyond it?

Question

css

There is one small block of about 100x100, inside of which there is a large block of about 200x200.
How to make a large block not climb out of a small one, but be inside it, like the content of an iframe tag?

<div style="background:#00FFFF;width:100px;height:100px">
<div style="background:#FF0000;width:200px;height:200px"></div>
</div>

Answer 1

write small block in css
overflow: auto;
jsfiddle.net/FavXP/1