Move an absolute positioned element's right side to the left side of it's parent - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:Absolute Position

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

Description

Move an absolute positioned element's right side to the left side of it's parent

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <meta name="viewport" content="width=device-width, initial-scale=1"> 
  <style id="compiled-css" type="text/css">
div {<!--from   w w w  . j  a  v a  2  s  . com-->
   position:relative;
   display:inline-block;
   margin:41px 201px;
   background:Chartreuse;
}

div>div {
   position:absolute;
   top:21px;
   margin:0;
   background:yellow;
   white-space:nowrap;
}
</style> 
 </head> 
 <body> 
  <div>
    Lorem ipsum dol 
   <div>
     Lorem ipsum dolor sit amet, consec 
   </div> 
  </div>  
 </body>
</html>

Related Tutorials