html - 2 つのボタンを並べて表示するにはどうすればよいですか?

Question

2 つのボタンがUpdateあり、Cancel並べて表示したい。

ただし、2 つのボタンの間に切れ目があります (添付の画像を参照)。

HTMLコードは次のとおりです。

<div class="form_block span2">
    <br>
    <input class="btn btn-primary" type="submit" value="Update" style="display:inline;"/> 
    <a class="btn btn-danger" style="display:inline;" href="{% url profile_detail profile.user.username %}">Cancel</a>
</div>

2 つのボタンを並べて表示するにはどうすればよいですか?

Answer 1

ボタンを<ul>要素に配置し、各ボタンを要素に配置<li>しますstyle="display:inline"

コード例:

<style>
ul
{
list-style-type:none;
margin:0;
padding:0;
}
li
{
display:inline;
 }
 </style>

 <div class="form_block span2"><br>
    <ul>
      <li><input class="btn btn-primary" type="submit" value="Update" /></li>
      <li><a class="btn btn-danger" href="{% url profile_detail profile.user.username %}">Cancel</a></li>
    </ul>
 </div>