The current min-height setting provides percentage values (0-100) to the user, this is easier to understand as pixel values. However, technically it's the CSS Viewport-Height (VH) unit and this is problematic in many cases, especially because boxes grow way too much on higher screens in some cases.
Users often use this feature to equalize the height of contents aligned next each other.
First we should check if we're able to improve the min-height setting, by adding a "max-height"-pixel-value, what technically is CSS min()/max()/clamp() functions, NOT the CSS max-height property. So it should be possible to have something like: min-height: min($min_height_vh_value, $max_height_px_value).
This way we prevent the growing by still having the VH-min-height.
Maybe we could improve it furthermore by also adding a Pixel-min-height with clamp(), check out this => https://codepen.io/thomas-frobieter/pen/QWGXWvM
This way we could also prevent the box from becoming to flat.
So the settings should contain:
- The min-height (VH) field becomes the "Height" field (just change the label)
- Add a "Minimum Height (Pixel)" (field_min_height_clamp_min)
- Add a "Maximum Height (Pixel)" (field_min_height_clamp_max)
Active
1.0
Code
@thomas.frobieter still relevant with or for https://www.drupal.org/project/drowl_paragraphs_bs → ?
@thomas.frobieter should we move this over to drowl_paragraphs_bs or is this already solved and should be closed won't fix?