HTML CSS examples for CSS Widget:Button
Create full width button with border
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> * {<!--from w w w. ja va 2 s .co m--> margin:0px; padding:0px; } .clear { clear:both; height:0px; font-size:0px; line-height:0px; } .button { padding-right:16px; background:url('https://www.java2s.com/style/demo/Google-Chrome.png') no-repeat right top; height:21px; background:red; } .button .left { background:url('https://www.java2s.com/style/demo/Google-Chrome.png') no-repeat right top; width:16px; height:21px; float:left; background:red; } .button .inner { height:21px; background:url('https://www.java2s.com/style/demo/Google-Chrome.png') repeat-x right top; text-align:center; background:Chartreuse; } </style> </head> <body> <div class="button"> <div class="left"></div> <div class="inner"> Lorem </div> <div class="clear"></div> </div> </body> </html>