html - 如何使用 bootstrap css 将 2 个输入合并为 1 个输入?

标签 html css twitter-bootstrap

我有 2 <input>彼此相邻的字段。我想要实现的东西类似于 for class class="input-group-addon"在 Bootstrap 中 - 不幸的是它只适用于 <span> . 如何将这些输入合并为一个?

jsFiddle

这就是我要找的:

target

最佳答案

试试这个 CSS:

#firstInput {
  width: 30%;
  display: inline-block;
  float: left;
  border-bottom-right-radius: 0;
  border-top-right-radius: 0;
}
#secondInput {
  width: 70%;
  display: inline-block;
  float: left;
  border-bottom-left-radius: 0;
  border-top-left-radius: 0;
  border-left:0px;
}

和 HTML:

<div class="form-group">
  <label for="firstInput">First Input</label>
  <div>
    <input type="text" id="firstInput" name="firstInput" ng-model="obj.firstInput" class="form-control">
    <input type="text" id="secondInput" name="secondInput" ng-model="obj.secondInput" class="form-control">
  </div>
</div>

关于html - 如何使用 bootstrap css 将 2 个输入合并为 1 个输入?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42503186/

相关文章:

html - 如何在网格列内定位 Bootstrap 弹出窗口?

javascript - 单击 Bootstrap Accordion 时打开 url/文件

html - 无法将页眉粘贴在页面顶部

html - 固定定位的 Bootstrap 崩溃

html - 在 Blogger 博客中隐藏其侧边栏后,如何使特定帖子页面 100%?

javascript - jQuery 悬停效果 for::after

css - 如何使内容 li 标签在第一个文本中对齐

html - Firefox 无法识别我的样式表

css - 子类化或扩展 djangcms 插件

iphone - 我可以在 iPhone/iPad 上为 HTML5 视频换肤吗?