如何减小输入组附加Bootstrap的大小

时间:2019-02-28 07:26:27

标签: css bootstrap-4

enter image description here

    Intent intent = context.getPackageManager().getLaunchIntentForPackage("com.facebook.katana");
if (intent != null) {
     Intent shareIntent = new Intent();
     shareIntent.setAction(Intent.ACTION_SEND);
     shareIntent.setPackage(application);
     shareIntent.putExtra(android.content.Intent.EXTRA_TITLE, title);
     shareIntent.putExtra(Intent.EXTRA_TEXT, description);
   startActivity(shareIntent);
} else {
    // The application does not exist
    // Open GooglePlay or use the default system picker
}

如何降低input-group-addon图标的高度? 它必须等于输入计时器框的大小。

谢谢。

2 个答案:

答案 0 :(得分:2)

         .input-group.check {
         position: relative;
         padding-left: 125px;
         }
         .input-group-addon.check2 {
         position: absolute;
         top: 59%;
         left: 0;
         transform: translateY(-50%);
         width: 125px !important;
         height: 40px;
         display: block;
         padding-top: 12px;
         }

我只是按照我的要求修改了上面的代码,它有所帮助。 谢谢。enter image description here

答案 1 :(得分:1)

检查此代码段,

.form-control.timepicker {
  height: 100px; /* Sample height */
}
.input-group {
  position: relative;
  padding-left: 50px;
}
.input-group-addon {
  position: absolute;
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 50px !important;
  height: 30px;
  display: block;
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="input-group">
  <span class="input-group-addon" id="basic-addon1">@</span>
  <input type="text" class="form-control timepicker" placeholder="Username" aria-describedby="basic-addon1">
</div>