Change the background color of particular div columns - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:Parent Container

  1. HOME
  2. HTML CSS
  3. CSS Layout
  4. Parent Container

Description

Change the background color of particular div columns

Demo Code

ResultView the demo in separate window 

<html lang="en">
 <head> 
  <style>
.container {<!-- w ww  . jav  a 2  s . c  o  m-->
   background:grey;
   opacity:.8;
   width:501px;
   height:301px;
}

div {
   display:inline-block;
   width:100%;
}

.colored {
   background:red;
   width:31%;
   height:100%;
   margin-bottom:-100%;
   margin-right:-31%;
}
</style> 
 </head> 
 <body translate="no"> 
  <div class="container"> 
   <div class="colored" style="">
     &nbsp; 
   </div> 
   <div>
     Le Lorem Ipsum est simplement du faux texte employ? dans la composition et la mise en page avant impression. Le Lorem Ipsum est le faux texte standard de l'imprimerie depuis les ann?es 
   </div> 
  </div>  
 </body>
</html>

Related Tutorials