diff --git a/core/src/components/input/test/spec/index.html b/core/src/components/input/test/spec/index.html index 058e472911..041958cc2a 100644 --- a/core/src/components/input/test/spec/index.html +++ b/core/src/components/input/test/spec/index.html @@ -13,7 +13,7 @@ - + Floating: input @@ -34,6 +34,16 @@ Stacked: div
A div
+ + + Align items: center +
A div
+
+ + + Align items: center +
A div: align self right
+
Floating: textarea diff --git a/core/src/components/item/item.scss b/core/src/components/item/item.scss index 3b38b5fa49..ecbfcae447 100644 --- a/core/src/components/item/item.scss +++ b/core/src/components/item/item.scss @@ -79,6 +79,9 @@ position: relative; + align-items: center; + justify-content: space-between; + outline: none; color: var(--color); @@ -87,9 +90,9 @@ text-align: initial; text-decoration: none; - box-sizing: border-box; overflow: hidden; + box-sizing: border-box; } @@ -202,8 +205,8 @@ display: flex; position: relative; - align-items: center; - justify-content: space-between; + align-items: inherit; + justify-content: inherit; width: 100%; min-height: var(--min-height); @@ -313,9 +316,8 @@ button, a { // Item Input // -------------------------------------------------- -:host([vertical-align-top]), :host(.item-input) { - align-items: flex-start; + align-items: center; } .input-wrapper { @@ -323,6 +325,7 @@ button, a { flex: 1; flex-direction: inherit; + align-items: inherit; align-self: stretch; @@ -332,8 +335,8 @@ button, a { box-sizing: border-box; } -:host(.item-label-stacked) .item-native, -:host(.item-label-floating) .item-native { +:host(.item-label-stacked), +:host(.item-label-floating) { align-items: start; }