Zarovnání potomků napříč více elementy

Ahoj,

připravil jsem krátkou ukázku, co mám: Řešení ad. 2

O co jde?
Mám blogový výpis, článků, kde neznám výšku nadpisu, ani perexu (i kvůli responsivitě). Nechci ani jedno, ani druhé osekávat, nechci obojímu nastavovat (minimální) výšku.

Nejsem silný ve flexu, gridu, atd., to jde už trochu mimo mě, můj dotaz je tak následovný:
1. jde (v rámci trojice v daném řádku) nastavit výšku všech nadpisů dle nejdelšího? Totéž pro perex. Obrázky by pak byly na stejné úrovni (mají stejný rozměr a vše by vypadalo suprově).

2. alternativně, opět v rámci elementů v daném řádku, nechat na sebe nadpis a perex volně navazovat (tzn. začátek perexu bude napříč boxy různý, bude vždy navazovat na nadpis, ale bude případně zdola odsazen více od obrázku

V rámci ukázky kódu jsem požadovaného pro ukázku docílil odřádkováním v kódu, abych nemusel otevírat photoshop a kreslit, jaké jsou požadované stavy :-)

Je to technicky možné? Pokud ano, předem děkuji za pomoc :-)

Jen doplním, zde pracuji se 3 elementy v řádku, to je v pořádku a je to požadované zobrazení. Řádků může být více, a měly by na sobě být nezávislé (pracovat vždy s tou trojicí v konkrétním řádku).

Keeehi:
Ne, o tabulku se opravdu nesnazim :-)

Jde o výpis článku blogu, kde se každý skládá z několika prvku. Nadpis, perex, obrázek, pod nim možná datum, read more button. Nebo výpis produktů. Nebo cokoliv dalšího.

Do tabulkovych dat to má hodně daleko, a tabulka (ani tabulkový display) pro to není řešením.

Otázka zní, je ten požadavek, který chci, řešitelný na úrovni stylu ať jedním, nebo druhým způsobem? Nastavení výšky x řádku pro oba vnorene elementy a orez pomoci ellipsis beru jako krajní řešení.

Keeehi:
Bude to responsivni, trojice na řádku je příklad, resp. požadované řešení pro desktop. Celkově muže být příspěvku (.card element) třeba 10, po 3 v řádku, na tabletu po dvou, na telefonu po jednom, tam už nejake rovnani řešit nemusíme, vše bude dlouhé podle své délky. Plus jsou to vyloženě nejake boxy, které jsou samostatné a nedávají smysl číst tabulkove.

Aktuálně to řeším pro blogovy výpis, ale pokud si představis e-shop, výpis produktu v kategorii, je to vlastně úplně stejná úloha. Mas název produktu (různě dlouhý), krátký popis (různě dlouhý), obrázek, cenu, nějaký button, atd. Popis chceš zobrazit cely, název také (padá řešení orezu s ellipsis), ale zároveň nechceš mít kilometr prázdného místa, pokud se sejdou v daném řádku produtky, které mají všechny jednoradkovy název a jednorázový popis (prázdné místo vzniklé nastavením výšky oběma elementum tak, aby se název i popis vždy vešly).

Kajman:
Ten link na SO vypadá na první pohled jako řešení. Jsem na tabletu, zkusím na nej pak mrknout na počítači a dam kdyžtak vědět, jestli to řeší můj požadavek či nikoliv.

Kcko:
Ještě jsem to nedoresil, na první pohled se mi to zdálo celkem fajn. Výškou se mi to řešit nechce, protože bezpečná jsou 3+3 řádky, ale spousta karet bude třeba jen v režimu 1+1 radek a spousta volného místa.

Podporu display: contents jsem koukal už minule, měla by být kolem 94%, jestli si pamatuju dobre.

Můžeš odkázat, pro jakého klienta jste to řešili? Třeba bych se inspiroval, prip. měl argument do pranice :-)