Align UL list to the right of its container div element - HTML CSS CSS Widget

HTML CSS examples for CSS Widget:UL Alignment

  1. HOME
  2. HTML CSS
  3. CSS Widget
  4. UL Alignment

Description

Align UL list to the right of its container div element

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">
.box {<!--   w w w.j  av a2  s  .co  m-->
   width:81%;
   border:2px solid Chartreuse;
   overflow:hidden;
}

li {
   list-style:none;
   float:right;
}

a {
   display:block;
   padding:3px 11px;
}
</style> 
 </head> 
 <body> 
  <div class="box"> 
   <ul class="pagination"> 
    <li> <a href="#">link</a> </li> 
    <li> <a href="#">link</a> </li> 
    <li> <a href="#">link</a> </li> 
    <li> <a href="#">link</a> </li> 
    <li> <a href="#">link</a> </li> 
    <li> <a href="#">link</a> </li> 
   </ul> 
  </div>  
 </body>
</html>

Related Tutorials