Make the form and button on the same line - HTML CSS CSS Form

HTML CSS examples for CSS Form:input button layout

  1. HOME
  2. HTML CSS
  3. CSS Form
  4. input button layout

Description

Make the form and button on the same line

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">

#newsletter_form<!-- w w  w.  j  a  v  a 2s  .  co m-->
{
   display:inline;
   vertical-align:top;
   text-align:center;
}
#newsletter_form input
{
   margin: 0;
   vertical-align: middle;
}


      </style> 
 </head> 
 <body> 
  <form id="newsletter_form"> 
   <input type="text" placeholder="Enter you mail here ..."> 
   <input type="image" src="https://www.java2s.com/style/demo/Safari.png"> 
  </form>  
 </body>
</html>

Related Tutorials