在中心对齐表格中的元素

在中心对齐表格中的元素

我是前端的新手。我实际上想制作一个看起来像这样的标记,

javascript - 在中心对齐表格中的元素-LMLPHP

所以,我尝试了以下方式

 <div className="row">
    <div className="col-xs-4">
      <div className="has-feedback">
        <label className="control-label">Search Job</label>
          <input type="text" className="form-control" id="inputValidation" placeholder="Search"/>
               <span className="glyphicon glyphicon-search form-control-feedback"></span>
         </div>
      </div>
</div>


现在在这里
  我得到的是

javascript - 在中心对齐表格中的元素-LMLPHP

谁能帮我这个?

最佳答案

这是完整的代码给您:)

<!DOCTYPE html>
<html lang="en">
<head>
<title>form</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"/>
<style>
  .mi-abc {
    padding: 10px;
    display: inline-block;
    background: lightgrey;
  }
  .mi-control {
    width: 75%;
    height: 35px;
    padding-left: 10px;
  }
  .mi-icon {
    position: absolute;
    right: 30px;
    top: 20px;
  }
</style>
</head>
<body>
  <div class="col-md-3 mi-abc">
    <div class="wrapper">
      <label class="mi-label">Search Job</label>
      <input type="text" class="mi-control" placeholder="Search"/>
      <span class="glyphicon glyphicon-search mi-icon"></span>
    </div>
  </div>
</body>

关于javascript - 在中心对齐表格中的元素,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/52112793/

10-11 05:46