HTML CSS examples for CSS Widget:UL Alignment
List left alignment and right alignment
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> ul {<!--from w ww . j a v a 2 s . c om--> padding:0; margin:0 } li { display:inline-block; width:51px; background:Chartreuse; padding:6px } .left li { float:left } .right li { float:right } .first { background:red } </style> </head> <body> <h3>Lorem ipsum do</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat.</p> <ul class="left"> <li class="first">Lor</li> <li>Lor</li> <li>Lor</li> <li>Lor</li> </ul> <br> <h3>Lorem ipsum dol</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi ullamcorper molestie lacus sed fermentum. Aliquam erat volutpat. Ve</p> <ul class="right"> <li class="first">Lor</li> <li>Lor</li> <li>Lor</li> <li>Lor</li> </ul> </body> </html>