mirror of
https://github.com/twbs/bootstrap.git
synced 2022-11-09 12:25:43 -05:00
Ensure proper sizing of and alignment of content within input group addons and buttons
Fixes #20927.
This commit is contained in:
parent
93ac9381be
commit
259a420d70
1 changed files with 14 additions and 1 deletions
|
@ -24,6 +24,7 @@
|
|||
@include hover-focus-active {
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
@if $enable-flex {
|
||||
flex: 1;
|
||||
} @else {
|
||||
|
@ -40,7 +41,12 @@
|
|||
.input-group-addon,
|
||||
.input-group-btn,
|
||||
.input-group .form-control {
|
||||
@if not $enable-flex {
|
||||
@if $enable-flex {
|
||||
// Vertically centers the content of the addons within the input group
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
} @else {
|
||||
display: table-cell;
|
||||
}
|
||||
|
||||
|
@ -158,9 +164,16 @@
|
|||
// element above the siblings.
|
||||
> .btn {
|
||||
position: relative;
|
||||
|
||||
@if $enable-flex {
|
||||
// Vertically stretch the button and center its content
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
+ .btn {
|
||||
margin-left: (-$input-btn-border-width);
|
||||
}
|
||||
|
||||
// Bring the "active" button to the front
|
||||
@include hover-focus-active {
|
||||
z-index: 3;
|
||||
|
|
Loading…
Reference in a new issue