I have two groups of dynamic content within a container that I am trying (unsuccessfully so far!) to align. Currently looks like:
The problem is the titles are varying over 1 or 2 lines and throwing the rest of the layout out. I have tried using table display with my divs, and flex, and nothing has worked so far (I may not be doing it correctly).
I want the link, the excerpt text, and the byline (which are all fixed) to be aligned. I was trying to align it to the bottom, and keep the header as is (at the top).
The struture of the html (in a cms so at this stage I can't change it), is:
<article id="post-xyz">
<div><img etc></div>
<div class="text-container">
<header>
<h3>the Problem Title</h3>
<div class="fixed-byline>etc</div>
</header>
<div class="wordcount-fixed-excerpt">
<p>etc</p>
<a>continue reading</a>
</div> (end excerpt)
</div> (end text)
</article>
