如何在单行中对齐HTML元素

Question

我有一个文本，选择按钮和image.nep。在中对齐它。但是它是一个接一个的。我的HTML代码是：

 <script>
 File :<input type="file" name="files"/>
       <img src="abc.jpg"/>
 </script>

Answer 1

尝试将 display: inline-block添加到元素中。

    <script>
     File :<input type="file" name="files" style="display: inline-block;"/>
         <img src="abc.jpg" style="display: inline-block;"/>
    </script>

Answer 2

这可以通过使用" Inline-Block"来完成。例如：

.element1 {display:inline-block;margin-right:10px; width:200px;} 
.element2 {display:inline-block; width:200px;} 
<div id="element1">  File :<input type="file" name="files"/> </div> 
<div id="element2">  <img src="abc.jpg"/> </div> 

内联块元素就像内联元素，但它们的宽度和高度可以。

Answer 3

By default input and img tags are inline elements, It will not go to next line.
Issue here is you have used <script> instead of <div>

示例此处