Question

我有一个文字，选择按钮和图片。需要在一行中对齐它。但它是一个接一个地来。我的HTML代码是：

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

Answer 1

这可以通过使用“内联块”来完成。例如：

.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 2

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

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

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>

Example here

如何在一行中对齐html元素？

3 个答案: