HTML将元素放在同一行中

Question

我有以下表格在Asp.NET MVC中上传文件（使用一些Bootstrap css）。现在＆＃34;清除＆＃34;按钮是下面的输入字段;如何使它在输入字段的右侧？

我考虑过使用<table>并且输入字段有一列，按钮有一列，但它看起来不合适，当我尝试时，Visual Studio给了我那些波浪线。

@using (Html.BeginForm("Index", "Uploader", FormMethod.Post, new { enctype = "multipart/form-data" }))
{
    <div class="form-group">
        <input type="file" name="files" id="file1" />
        <button onclick="reset2($('#file1'));event.preventDefault()">Clear</button>
        <span class="field-validation-error" id="err1"></span>
        @Html.ValidationMessage("1")
    </div>

    <div class="form-group">
        <input type="file" name="files" id="file2" />
        <button onclick="reset2($('#file2'));event.preventDefault()">Clear</button>
        <span class="field-validation-error" id="err2"></span>
        @Html.ValidationMessage("2")
    </div>
... more file input fields
}

Answer 1

输入上的简单style="display:inline"将如下工作;

   <div class="form-group">
     <input type="file" name="files" id="file1" style="display:inline" />
        <button onclick="reset2($('#file1'));event.preventDefault()">Clear</button>
        <span class="field-validation-error" id="err1"></span>

    </div>

    <div class="form-group">
        <input type="file" name="files" id="file2" style="display:inline" />
        <button onclick="reset2($('#file2'));event.preventDefault()">Clear</button>
        <span class="field-validation-error" id="err2"></span>

    </div>

我确信有些人会比我的答案更好，但更多的是自助式。

<强> Fiddle

屏幕抓取