i just started reading about web development recently but am finding it add to understand please i need to realy get how to do those division cause it is realy giving me problem very well
this is the html code

 <div class="header-3">
         <section>
          <div class="first">
             <div class="second">
               <div class="third">
                 <div class="fourth">
                  <div class="fifth">
                    <div class="sixth">
                      <div class="seventh">

                      </div>
                    </div>
                  </div>
                 </div>
                </div>
             </div>
          </div>
        </section>

and this is the css

.first{
  border: 1px solid yellow;
  margin-top:-1px;
  width:170px;
  height: 8px;
  background-color: yellow

 }
 .second{
  border: 1px solid red;
  margin-top:-1px;
  width:200px;
  height: 8px;
  margin-left: 170px;
  background-color: red;
 }
 .third{
  border: 1px solid blue;
  margin-top:-1px;
  width:200px;
  height: 8px;
  margin-left: 200px;
  background-color: blue;
 }
 .fourth{
  border: 1px solid green;
  margin-top:-1px;
  width:200px;
  height: 8px;
  margin-left: 200px;
  background-color: green;
 }
 .fifth{
  border: 1px solid #9b6849;
  margin-top:-1px;
  width:231px;
  height: 8px;
  margin-left: 200px;
  background-color: #9b6849;
 }
 .sixth{
  border:1px solid orange;
  margin-top:-1px;
  width:260px;
  height:8px;
  margin-left: 200px;
  background-color:orange;
}

Hey there,
You might want to make thing simpler by only focusing on one or two objects at a time. What you might want to do is to make a complete copy of the page in question, then in the copy, take out all but one or two of the DIV containers.

Also, it looks like you are trying to "nest" those DIv containers, one inside the other. In your "copy" webpage, you might want to avoid doing that for the time being. Learn what a DIV is and how it works BEFORE you make a whole bunch of them interact.

cheers,
Pablo