html - 在顶部放置 1 个标签，在底部放置 1 个输入，在左侧放置 2 个按钮

Question

我想在 Input 的顶部放置 1 个标签，右侧有两个居中按钮(在 div 内)。

目前我的代码不灵活，我无法在任何地方轻松使用我的类在我的网页上，因为它强烈依赖于 #.bu-container 高度，它比它应该的大得多。此外，在不同浏览器上调整更多尺寸时，我不确定是否会有好的结果。

预先感谢您的回复，

这是我的错误代码:

#position {
  height: 500px;
}
.bu-container {
  margin: 10px;
  display: block;
  float: left;
  height: 50px;
  width: 400px;
  overflow: hidden;
}
.bu-container input {
  float: left;
}
.bu-container .bu {
  float: right;
  top: 0px;
  right: 50px;
  padding: 1px;
}
.bu-container button {
  height: 10px;
  display: block;
}

<div id="Position">
  <span class="bu-container">
            	<span class="bu"> <button></button> <button></button> </span>
  <label>Height</label>
  <input id="LHeight" min="0" type="number" value="">
  </span>
  <span class="bu-container">
                <span class="bu"> <button></button> <button></button> </span>
  <label>Width</label>
  <input id="LWidth" min="0" type="number" value="">
  </span>
  <span class="bu-container">
                <span class="bu"> <button></button> <button></button> </span>
  <label>X</label>
  <input id="x" min="0" type="number" value="">
  </span>
  <span class="bu-container">
            <span class="bu"> <button></button> <button></button> </span>
  <label>Y</label>
  <input id="y" min="0" type="number" value="">

  </span>
</div>

Answer 1

检查一下....

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0px;
  padding: 0px;
}
#position {
  height: 500px;
}
.row-container {
  
  display: inline-block;
  text-align: justify;
  margin: 0px auto;
  width: 100%;
  margin-top:10px;
  margin-bottom:10px;
  border:5px solid #ccc;
  padding:10px;
}
.input-text-container {
  display: inline-block;
  width: 50%;
 
}
.input-text-container input {
  width: 100%;
}
.button-container {
  width: 49%;
  display: inline-block;
  margin: 0px auto;      
  text-align:center;
}
.button-container button {


}

<div id="Position">
  <div class="row-container">
    <div class="input-text-container">
      <label for="LHeight">Height</label>
      <input id="LHeight" min="0" type="number" value="">
    </div>
    <div class="button-container">
      <div>
        <button>button1</button>
      </div>
      <div >
         <button>button2</button>
      </div>       
    </div>
  </div>
      </div>