html - 如何让两个按钮并排显示？

Question

我有两个按钮Update，Cancel我想并排显示。

然而，两个按钮之间有一个中断（见附图）。

这是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>

如何让两个按钮并排显示？

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>