html - 如何连续移动两个输入框

Question

我设计了两个输入框，我想把它们一起移动，但是我的代码不起作用

这应该有一个简单的解决方案，但它们只是看起来像一个列表，而不是排成一行。

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />

<h2>ِStart Time</h2>
<div class="row">
  <div class="col">
    <label for="startTime">Hour(s) </label>
    <input type="number" class="form-control" id="startTime" min="0" max="23">
  </div>
  <div class="col">
    <label for="startTime">Minute(s) </label>
    <input type="number" class="form-control" id="startTime" min="0" max="59">
    <!--input type can be changed accordingly-->
  </div>
</div>

我哪里做错了？

Answer 1

我不知道你到底想要什么。它在现代浏览器中运行良好。 col 类可能有问题。有时我会在这门课上遇到一些烦人的事情。只需使用网格系统更改它们即可。这是下面的代码，

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.1.3/css/bootstrap.min.css" rel="stylesheet" />

<h2>ِStart Time</h2>
<div class="row">
  <div class="col-sm-6">
    <label for="startTime">Hour(s) </label>
    <input type="number" class="form-control" id="startTime" min="0" max="23">
  </div>
  <div class="col-sm-6">
    <label for="startTime">Minute(s) </label>
    <input type="number" class="form-control" id="endTime" min="0" max="59">
    <!--input type can be changed accordingly-->
  </div>
</div> 

我想你一定知道bootstrap的网格系统。 https://getbootstrap.com/docs/4.0/layout/grid/