HTML CSS examples for CSS Widget:Button
Text field with attached button
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style id="compiled-css" type="text/css"> .header {<!-- w ww . j a v a 2 s .c o m--> width:100%; position:fixed; left:0; top:0; height:81px; background-color:Chartreuse; -webkit-box-shadow:3px 3px 5px yellow; box-shadow:3px 3px 5px blue; } .header input[type="text"] { background-color:pink; border:2px solid OrangeRed; border-top-left-radius:7px; border-bottom-left-radius:7px; font:normal Myriad Pro, Verdana, Geneva, sans-serif 13px; color:grey; line-height:26px; padding-left:7px; } .header input[type="button"] { background-color:BlueViolet; border:2px solid Chartreuse; border-top-right-radius:7px; border-bottom-right-radius:7px; font:normal Myriad Pro, Verdana, Geneva, sans-serif 12px; color:yellow; line-height:27px; margin-top:2px; display:inline-block; padding:0 5px; display:inline-block } </style> </head> <body> <div class="header"> <table width="300" border="0" align="center" cellspacing="0" cellpadding="0"> <tbody> <tr> <td> </td> <td align="right"> </td> </tr> <tr> <td>L</td> <td align="right"> <input type="text" name="textfield" id="textfield" value="Search here"> <input name="" type="button" value="Go"> </td> </tr> </tbody> </table> </div> </body> </html>