Problems Aliging div Tags as tabel cells

Hello everyone and thanks for the help in advance. I am having problems aligning div tags arranged as table cells. The page and segment can be viewed at When viewed in a full desktop, the top of the image aligns with the top of the text. However, once I switch to any mobile, nothing really lines up. I (think) I have the images and descriptions set up correctly as table rows and cells with the css, but it falls apart pretty badly and I’m not understanding why. Any help would be appreciated.

It looks like it’s at the top to me and the only problem I can see is that you are using a span for the text and not getting proper formatting.

This element should be a p tag and avoid the need for breaks.

<span> Wednesday, March 11th 2020, 3:35 PM EDT by Dave Elias</span>

Make that a p tag and then set the margins as required (e.g. margin:0 0 2rem). Note that will require changing the css as you are targeting the span.

If you can’t be bothered to change to the correct html element then ensure you set the span to display block and again use margins to make space and not breaks.

.mediadescriptioncell span{display:block;margin: 0 0 2rem;}

Adding display:block (or changing to a p tag) will make the text sit a little higher as the line-height takes effect.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.