Print with absolute positioning - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:Absolute Position

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

Description

Print with absolute positioning

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <style type="text/css">
#a {<!--from  w ww. j a v  a2 s  .  c om-->
   position:relative;
   height:51px;
   left:71px;
   border:11px solid Chartreuse;
}

#b {
   position:relative;
   top:21px;
   height:2001px;
   left:71px;
   border:11px solid yellow;
}

#c {
   position:relative;
   top:51px;
   height:251px;
   left:71px;
   border:11px solid blue;
}

#d {
   position:relative;
   top:100px;
   height:3001px;
   left:71px;
   border:11px solid pink;
}
</style> 
 </head> 
 <body>
   Lorem ip 
  <div id="a">
    Lorem ipsum dolor sit amet, consectetur adi 
  </div> 
  <div id="b">
    Lorem ipsum 
  </div> 
  <div id="c">
    Lorem ipsum dolo 
  </div> 
  <div id="d">
    Lorem ipsum dol 
  </div>Lorem ips  
 </body>
</html>

Related Tutorials