Suggestion: Ability to adjust the height of a display:inline-block element without pushing away other elements.

[HT-7]

Moderators of news aggregator subverses (e.g. subreddits on Reddit) are able to create a custom CSS for their community page.

But they can not edit the HTML. Therefore, they are limited to the possibilities that CSS offers.

Some moderators choose a multi-column design for their community (screenshot found here), which can be achieved by reducing the width of one post element and applying display:inline-block. In that example screenshot, two post boxes are seen per row.

I have seen a different community (forgot where exactly) where each post had a box around it. Apparently, it was based on the so-called Naut design.

But there are some limitations:

• If no height is specified for each of these post info boxes, the size of the boxes will match the content, which causes the boxes in each row to have a different heights, which does not look so nice.
• If a fixed height is specified for each of these boxes, the boxes with lesser content than needed to fill that height will have an empty vertical gap, while the boxes with too much content will have an overflow that could be handled with overflow-y:scroll;.

But a much more elegant solution in the latter case would be having a box expand to its full height on :hover, but that hits two CSS walls (limitations) as well:

• One apparently can not transition smoothly from an absolute height (e.g. 150px) to a relative height (i.e. 100%).
• Unlike displacement with position:relative and top,bottom,left,right, increasing the height of the boxes with display:inline-block pushes away the boxes in the next row. But using any other solution than display:inline-block would not allow a multi-column design in first place.

There are likely solutions involving HTML, but as already mentioned, moderators of subreddits on Reddit (and similar sites) are bound to the limitations of CSS. Therefore, it would be good if the possibilities of CSS get expanded, even if there is already a HTML-supported workaround.

[Loirooriol]

If you are increasing the height but don't want to push following elements, just add a negative margin-bottom?

[frivoal]

Also, it seems that this design would be better served by using https://drafts.csswg.org/css-grid/ and having each post be a grid item rather than by using inline-blocks. In the case of Reddit, this should be doable without changes to the HTML markup, since the posts are direct children of a container element.