Here it is mockup –
please advise, how to add empty row to move down middle image from this example.
I tried to do this – but it didn’t work for me –
image size all the same for all post (for featured images)
is it possible to add some CSS container with fixed height for title ? In this case Title verical size will be the same for all string length.
There is no real way to do this in responsive design without using tables, as CSS is designed to “float” based on browser, content width, etc. — so, if you set a fixed height and somebody did a zoom, text would be chopped off. If the browser viewport changes and the text drops onto another line, the last line would get chopped off, etc.
This is why we usually use modules where image is on top, then the headline so that the “apparent” height of the photos across a horizontal row looks more consistent.
The old way was to use tables, where the headline would be in a table cell, photo in cell, excerpt in cell; but the webdev world decided tables were bad (stupid). Bootstrap 4 is doing some cool things as workaround for this kind of issue, but in normal CSS no real way to do that very well.
Try using module with photo on top, then the headline, and see how that looks. 🙂
(( CORRECT ME IF WRONG! ))
Thanks for a quick response, Chris!
I will try – you are right 🙂
Thanks again for your time !
