Html 如何在rails中以简单的形式使用CSS将两个div放在同一行上？

把两个div放在同一行是个老问题。但在rails中使用简单表单时，我找不到解决方案。我想做的是在同一行上显示内容及其标签。标签的宽度为125px（

.left

），内容位于右侧（

.right

）。标签中的文本向右对齐，内容中的文本向左对齐

以下是HTML：

<form id="new_production" class="simple_form new_production" novalidate="novalidate" method="post" action="/projects/1/productions" accept-charset="UTF-8">
    <div style="margin:0;padding:0;display:inline">
        <input type="hidden" value="✓" name="utf8">
        <input type="hidden" value="2UQCUU+tKiKKtEiDtLLNeDrfBDoHTUmz5Sl9+JRVjALat3hFM=" name="authenticity_token">
    </div>
    <div class="left">Proj Name：</div>
    <div class="right">must have a name</div>
    <div class="input string required">

但是，结果中有一个换行符，如下所示：

Proj Name：
must have a name

简单形式的雇员再培训局代码为：

<div class="left">Proj Name：</div><div class="right"><%= @project.name %></div> 

项目名称：

我不想使用表格，但CSS只是为了解决这个问题

不能浮动或设置内联元素的宽度。删除

显示：内联应该显示良好

编辑：您可以设置宽度，但它会导致元素呈现为块。
您的css很好，但我认为它不适用于div。只需编写简单的类名，然后重试。
你可以在网上查一下

为什么不使用flexbox？所以把它们放进另一个像那样的分区


.flexContainer{
利润率：2x10px；
显示器：flex；
} 
.左{
弹性基准：30%；
}
.对{
弹性基准：30%；
}

项目名称：
必须有名字
显示的代码有效。向我们展示不起作用的代码。与
display:inline
一样，有什么问题吗？我猜很简单，表单正在生成html包装。您能显示浏览器生成的html代码吗？您发布的新html代码与您提供的CSS显示得很好。Did rake资产：预编译并重新启动rails服务器。它显示两行。它是否因为简单的表单和导轨而无法工作？
<div class="left">Proj Name：</div><div class="right"><%= @project.name %></div> 

.left {
  float: left;
  width: 125px;
  text-align: right;
  margin: 2px 10px;
  display: inline;
}

.right {
  float: left;
  text-align: left;
  margin: 2px 10px;
  display: inline;
}