HTML CSS examples for CSS Layout:Position
Position div within a list item in the middle
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .wrap {<!--from w w w .j a va 2 s . c om--> background:gray; height:61px; margin:0 0 21px; } .wrap .inner { background:white; float:right; } .wrap.one { display:table; width:100%; } .wrap.one .inner-wrap { display:table-cell; vertical-align:middle; } .wrap.two { position:relative } .wrap.two .inner { margin-top:-10px; position:absolute; right:0; top:51%; } </style> </head> <body> <div class="wrap one"> <div class="inner-wrap"> <div class="inner"> Lorem </div> </div> </div> <div class="wrap two"> <div class="inner"> Lorem </div> </div> </body> </html>