Html 同一行上的标签和输入字段

我已经在这里花了很多时间，并试图实现这一点，但到目前为止什么都没有。我想在同一行上添加标签和输入字段。。就这么简单，但我还没弄明白

我有一张简单的表格

<section id="container">

<form name="hongkiat" id="hongkiat-form" method="post" action="#">

<div id="wrapping" class="clearfix">

<section id="aligned">

    <div class="block">
          <label for="name">Full Name</label>
          <input type="text" name="name" id="name" placeholder="Full Name" autocomplete="off" tabindex="1" class="txtinput">
    </div>
    <div class="block">
        <label for="email">Email Address</label>
        <input type="email" name="email" id="email" placeholder="Your e-mail address" autocomplete="off" tabindex="2" class="txtinput">
    </div>
    <div class="block">
        <label for="message">Statement</label>
        <textarea name="message" id="message" placeholder="Statement" tabindex="5" class="txtblock"></textarea>
    </div>
        </section>

    </div>
    <section id="buttons">
        <input type="reset" name="reset" id="resetbtn" class="resetbtn" value="Reset">
    </section>
    </form>
</section>

下面是is现在的完整演示：

---

请告诉我这里还需要更改什么？

您的代码已经尝试将标签和输入放在同一行上，但是您的输入的宽度：90%使它太大，因此它放在另一行上。试着减少输入的宽度，它就会起作用。

---

例如，尝试将输入宽度减少到70%，并将标签宽度从40px改为160px。

我认为，既然是响应性的，就应该自己做这件事。。现在当你提到这一点时，我已经考虑过了，没有办法单独做到这一点。。谢谢，我知道我错过了一些简单的事情。它现在起作用了，只是个问题。这里是更新版本，它们位于同一行。你能告诉我为什么每个输入的标签都不是“绑定”的吗？例如，检查最后两个输入以及它们的标签在哪里：我认为最好添加一些类似.block{overflow:auto；}的东西来清理浮动。我已经尝试了标签{clear:tware；}，似乎也可以。谢谢

#hongkiat-form { box-sizing: border-box; }

#hongkiat-form .txtinput { 
    display: block;
    font-family: "Helvetica Neue", Arial, sans-serif;
    border-style: solid;
    border-width: 1px;
    border-color: #dedede;
    margin-bottom: 20px;
    font-size: 1.55em;
    padding: 11px 25px;
    width: 90%;
    color: #777;
  float: right;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset;
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1) inset; 
    transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
    -webkit-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
    -moz-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
    -o-transition: border 0.15s linear 0s, box-shadow 0.15s linear 0s, color 0.15s linear 0s;
}

#wrapping { width: 100%; box-sizing: border-box; }

.block label {
  display: inline-block;
  width: 40px; 
  float:left;
    font-family: "Droid Serif", Georgia, serif;
    font-size: 1.4em;
    line-height: 1.8em;
    font-weight: 500;  
}