Элементы размещения HTML в одной строке

Question

У меня есть следующая форма для загрузки файлов (с использованием некоторых Bootstrap css) в Asp.NET MVC. Прямо сейчас кнопка «Очистить» - ниже поле ввода; как сделать это справа от поля ввода?

Я думал об использовании <table> и имел один столбец для полей ввода и один для кнопок, но он не кажется подходящим, и Visual Studio давала мне squiggly линии, когда я пытался.

@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

захват экрана