Creating two HTML buttons goes side by side

Question

Well, I'm not very familiar with HTML or how it combines with CSS. I kept thinking about how to make two HTML buttons side by side. Here is the code I'm using right now.

<FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank"> <input type="submit" value="Forum Home Page"> </FORM> <FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank"> <input type="submit" value="Skill Guides"> </FORM> 

Regardless of whether I place them immediately after each other or set alignment for them. I can't seem to get them to go next to each other. I hope there is someone who can describe me easily and in detail.

Answer 1

If you understand correctly, you can simply attach the following CSS:

 form { display: inline; } 

As shown here: http://jsfiddle.net/zcz3j/

Answer 2

Demo http://jsfiddle.net/satinder_singh1/wr4Xv/1/

 <div id="main"> <div class="floatdiv"><FORM METHOD="LINK" ACTION="LINK TO WEBSITE" target="_blank"> <input type="submit" value="Forum Home Page"> </FORM></div> <div class="floatdiv"> <FORM METHOD="LINK" ACTION="LINK TO A DIFFERENT WEBSITE" target="_blank"> <input type="submit" value="Skill Guides"> </FORM></div></div>​ <style type="text/css"> #main { position:relative; width:200px; } .floatdiv { float:left; width=80px } </style> 

Answer 3

You can also try wrapping them in a table tag. This is how I fixed my similar problem. The table automatically sets them next to each other.