Update

4 files changed, 13 insertions, 6 deletions

diff --git a/src/_utils.scss b/src/_utils.scss
index 8ac1b01..ce0220a 100644
--- a/src/_utils.scss
+++ b/src/_utils.scss
@@ -63,7 +63,7 @@ $dirs: (
         margin#{$suffix}: auto;
     }
 
-    @each $size in (0 50 100) {
+    @each $size in (0 10 50 100 200) {
         @include iro.bem-utility('m#{$dir}-#{$size}') {
             margin#{$suffix}: fn.global-dim(--size --#{$size});
         }
@@ -75,7 +75,7 @@ $dirs: (
         padding#{$suffix}: auto;
     }
 
-    @each $size in (0 50 100) {
+    @each $size in (0 10 50 100 200) {
         @include iro.bem-utility('p#{$dir}-#{$size}') {
             padding#{$suffix}: fn.global-dim(--size --#{$size});
         }
diff --git a/src/layouts/_form.scss b/src/layouts/_form.scss
index 8228c44..15dca2e 100644
--- a/src/layouts/_form.scss
+++ b/src/layouts/_form.scss
@@ -15,13 +15,17 @@
     @include iro.bem-layout(iro.props-namespace()) {
         display:        flex;
         flex-direction: column;
-        align-items:    baseline;
         gap:            fn.dim(--item-spacing-y) fn.dim(--label-spacing-x);
     
+        @include iro.bem-elem('item') {
+            display: block;
+        }
+    
         @include iro.bem-modifier('labels-left', 'labels-right') {
             display:               grid;
             grid-template-columns: auto 1fr;
             grid-template-rows:    auto;
+            align-items:           baseline;
     
             @include iro.bem-elem('item') {
                 display: contents;
diff --git a/src/objects/_dialog.scss b/src/objects/_dialog.scss
index b0b435f..ad6e7db 100644
--- a/src/objects/_dialog.scss
+++ b/src/objects/_dialog.scss
@@ -76,6 +76,7 @@
             grid-area:  body;
             min-height: 0;
             margin-top: fn.dim(--title-body-spacing);
+            overflow:   auto;
         }
 
         @include iro.bem-elem('footer') {
diff --git a/src/objects/_field-label.scss b/src/objects/_field-label.scss
index e990568..4195e11 100644
--- a/src/objects/_field-label.scss
+++ b/src/objects/_field-label.scss
@@ -21,10 +21,11 @@
     ), 'colors');
 
     @include iro.bem-object(iro.props-namespace()) {
-        display: inline-block;
+        display: block;
 
         @include iro.bem-elem('label') {
             display:       block;
+            flex:          0 0 auto;
             padding-right: fn.dim(--spacing-x);
             color:         fn.color(--label);
             font-size:     fn.dim(--label-font-size);
@@ -37,7 +38,8 @@
         }
     
         @include iro.bem-elem('content') {
-            display: inline-block;
+            display: block;
+            width:   100%;
         }
     
         @include iro.bem-elem('hint') {
@@ -60,7 +62,7 @@
         }
     
         @include iro.bem-modifier('left', 'right') {
-            display:     inline-flex;
+            display:     flex;
             align-items: baseline;
     
             @include iro.bem-elem('label') {