css - 2 文本框不在行中显示

Question

我试图在一行中显示 2 个文本框及其标签。

我为此使用了 css，但它不起作用。

jsfidle demo

<div class="inq_form_label_prd">
Subject :
</div>
<div class="inq_form_content_prd">
    <input type="text" class="inq_txtbox_prd" name="inq_sub_msg">
</div>
<div class="inq_form_label_prd1">
    Subject :
</div>
<div class="inq_form_content_prd1">
    <input type="text" class="inq_txtbox_prd" name="inq_sub_msg">
</div>

CSS:

  .inq_form_label_prd
    {
        line-height: 28px;
        float: left;
        width: 120px;
        font-weight: bolder;
        text-align: right;
        padding-right: 10px;
        color: #666;
        margin-top:5px;
        margin-left:0px;
    }
    .inq_form_content_prd
    {
        margin-left: 130px;
        line-height: 28px;
        font-size:12px;
        font-weight:bolder;
    }
    .inq_form_label_prd1
    {
        line-height: 28px;
        float: left;
        width: 120px;
        font-weight: bolder;
        text-align: right;
        padding-right: 10px;
        color: #666;
        margin-top:5px;
        margin-left:200px;
    }
    .inq_form_content_prd1
    {
        margin-left: 390px;
        line-height: 28px;
        font-size:12px;
        font-weight:bolder;
    }

任何建议，为什么它不显示内联。我想要 2 个内联文本框和标签。以及新行中的下一个 2，依此类推。

谢谢。

Answer 1

DEMO

你可以让事情变得简单。

<div class="block">
    <div>Subject
        <input type="text">
    </div>
    <div>Subject
        <input type="text">
    </div>
</div>
<div class="block">
    <div>Subject
        <input type="text">
    </div>
    <div>Subject
        <input type="text">
    </div>
</div>

CSS

div {
    display: inline;
}
.block{
    width: 100%;
    display: block;
}