同じ行にあるHTMLボタン

Question

ブラウザで3つのボタンを作成したhtmlコードがあります。同じ行にボタンを配置するにはどうすればいいですか（別の行に表示されます）。

<form action="file:///C:/Users/andre/Desktop/home.html"/> 
     <input type="submit" value="Home" /> 

</form> 


    <form action="file:///C:/Users/andre/Desktop/players.html"/> 
     <input type="submit" value="Players" /> 

</form> 

<form action="file:///C:/Users/andre/Desktop/league.html"/> 
    <input type="submit" value="League" /> 
</form> 

Answer 1

input[type=submit]{cursor:pointer} 
 
form input{float:left;margin:5px}

<form action="file:///C:/Users/andre/Desktop/home.html"/> 
 
     <input type="submit" value="Home" /> 
 

 
</form> 
 
     
 
     
 
    <form action="file:///C:/Users/andre/Desktop/players.html"/> 
 
     <input type="submit" value="Players" /> 
 

 
</form> 
 

 
<form action="file:///C:/Users/andre/Desktop/league.html"/> 
 
    <input type="submit" value="League" /> 
 
</form>

Answer 2

ただ、formタグのデフォルトの表示値がブロックされ

<style> 
    form { display : inline-block; } 
</style> 

Answer 3

次のコードを追加します。それをインラインブロックにすると、その問題が解決されます。

<form style="display: inline-block;" action="file:///C:/Users/andre/Desktop/home.html"> 
 
    <input type="submit" value="Home" /> 
 
</form> 
 
<form style="display: inline-block;" action="file:///C:/Users/andre/Desktop/players.html"> 
 
    <input type="submit" value="Players" /> 
 
</form> 
 
<form style="display: inline-block;" action="file:///C:/Users/andre/Desktop/league.html"> 
 
    <input type="submit" value="League" /> 
 
</form>