Search code examples
cssstylesheet

Styling Divs with css


Whats the best way in order to style with css 3 div in this way: Div 1 and 2 (same width) one up and one down on the left side and div 3 on the right side. something like:

div1  { height: 200px; width:400px }
div2  { height: 600px; width:400px }
div3  { height: 800px; width:600px }

Solution

  • The best way is to first take two divs one should be to the left side and the other should be to the right side, the left one should have two more divs inside it. for example:

    /**** CSS FILE ****/
    .left{
      float:left;
      }
    
    .right{
      float:right;
      }
    
    .div1{
      width:400px;
      height:200px;
      }
    
    .div2{
      width:400px;
      height:600px;
      }
    
    .div3{
      width:600px;
      height:800px;
      }
    <!-- HTML File -->
    
        <div class="left">
             <div class="div1"> <!-- My div1 --> div1 </div>
             <div class="div2"> <!-- My div2 --> div2 </div>
        </div>
    
        <div class="right">
            <div class="div3"> <!-- My div3 --> div3 </div>
        </div>