Element alignment with absolute position - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:Absolute Position

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

Description

Element alignment with absolute position

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <meta http-equiv="Content-type" content="text/html; charset=UTF-8"> 
  <style type="text/css">
#center {<!--from w w  w  .j av a  2 s. co m-->
   text-align:center;
}

#parent {
   position:absolute;
   left:0;
   right:0;
   text-align:center
}

#nested {
   background-color:Chartreuse;
   width:281px !important;
   height:211px !important;
   display:inline-block
}
</style> 
 </head> 
 <body> 
  <div id="center"> 
   <div id="parent"> 
    <div id="nested"></div> 
   </div> 
   <div style="display: inline-block; width: 280px; height: 210px; background-color: #0c0;"></div> 
  </div>  
 </body>
</html>

Related Tutorials