Выход за границы

[linkoln_7]

Есть главный блок container,внутри него resize он может изменять свои размеры,подскажите как можно сделать так,что бы он не изменял размеры больше главного блока,не выходил за границы container
Заранее большое спасибо.


#container {box-shadow: 4px 0px 18px -1px #0000ff; width: 700px; height: 450px}


есть блок resize

.resize 
        {
            width:10px;
            height:10px;
  background-color: #29e;
  color: white;
  font-size: 20px;
  font-family: sans-serif;
  
  
   position: relative; 
    border: 2px solid;
    padding: 1px 1px; 
   
    resize: both;
    overflow: auto;

<div id ="container">


<div class="resize">
</div>

</div>