Layout Absolute positioned divs next to each other - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:Absolute Position

  1. HOME
  2. HTML CSS
  3. CSS Layout
  4. Absolute Position

Description

Layout Absolute positioned divs next to each other

Demo Code

ResultView the demo in separate window 

<html>
   <head> 
      <style type="text/css">
#container {<!--from   w ww . j ava2  s  .c o m-->
   position: relative;
   width: 200px;
   height: 200px;
   border: 1px solid red;
}
.icon {
   position: absolute;
   bottom: 0;
   left: 0;
   border: 1px solid green;
}
.icon:last-child {
   left: 200px;
   border: 1px solid green;
}

      </style> 
   </head> 
   <body> 
      <div id="container"> 
         <div class="icon">
             div 
         </div> 
         <div class="icon">
             div 
         </div> 
      </div>  
   </body>
</html>

Related Tutorials