Get two forms to display inline

I think what you want is to display them side by side. You can do it using floats instead like so:

<form style ='float: left; padding: 5px;'>
akjfhdkjahj<br />
 <input type = 'submit'/>
</form>
<form style ='float: left; padding: 5px;'>
  aklfjas<br />
  <input type = 'submit'/>
</form>

But even that's not ideal. What would be best is to wrap each < form > in < div >s and use float in the div tag instead.


If I understand the question correctly, you can use display:inline-block;

form{
    width:200px;           //JUST FOR SHOW
    height:200px;          //JUST FOR SHOW
    background:red;        //JUST FOR SHOW
    display:inline-block;  
    margin:1em;            
}

Example: http://jsfiddle.net/jasongennaro/dn5NQ/3/

Obviously, you will need to rework the content of the forms... as you say.

Tags:

Html

Css