How to do a <div> inside another to follow your grow without to pass of her.

Question

I trying to do a page responsive. However, not work in differents sizes of screens. I want that the grow to be more uniforme on screen.
My code:
<div class=container>
<div class="col-md-12" >
<div class="col-md-12">
<div class="col-md-8">
<div class="col-md-12" style="background: red; height: 25%"></div>
<div class="col-md-12 style="background: yellow; height: 25%""> <!-- Here I want a image background--> </div>
<div class="col-md-12" style="background: yellow; height: 25
page of exemplo base: http://qlip.in/
my page: http://image.ibb.co/k5YwZR/Sketch.png

Answer 1

Use div id's and you can put one inside the other if I am understanding your question right

Answer 2

I want that the content of the inside not pass of the div of outside. How this page here: http://qlip.in/