javascript - 将表格中的元素居中对齐

标签 javascript html css reactjs

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

enter image description here

所以,我尝试了以下方法,

 <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>

现在,这里, 我得到的是

enter image description here

谁能帮我解决这个问题?

最佳答案

这是给你的完整代码:)

<!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/

相关文章:

javascript - underscore.js each,迭代器引用错误

javascript - 来自给定选择器的 nodeList 的 Jasmine 测试事件监听器函数

html - 如何将嵌套的 ul 元素相对于 div 元素和 div 元素外部而不是其父元素定位

java - jfreechart 以及网页中的其他数据

html - 响应式布局中元素两侧的边距相等

html - Tab Focus 未反射(reflect)在 Mozilla 中

javascript - jQuery Accordion 不工作

javascript - 成功和 .then 之间的 jQuery AJAX 关系

javascript - 通过单击元素内的任意位置获取 DOM 范围

css - 如何在 bootstrap 网页上垂直分割 div?