Flex Block 1 and same block's height

Posted in: Newspaper
Post count: 95

Hi!

About Newspaper demo Gadgets PRO, is there the possibility on Flex Block 1, to have the same block’s height, with author alignment and “READ” to the bottom edge?

https://ibb.co/rQXxvHp ?

Thanks!

Post count: 35449

Hi,

This can be done only if you set an excerpt/length of words or letters for posts title and content https://i.imgur.com/a53B2U5.png -> https://i.imgur.com/4LWvCNt.png

Thank you!

Post count: 95

Calin, unfortunately, is a solution that does not suit my needs because then the phase shift comes with the title, when it is too short and remains on a line for example, and when it is long and is truncated on the fourth line.

You can play with something similar to

.td-module-meta-info {
height: 400px;
}

keeping author and READ MORE aligned at the bottom?

Post count: 35449

Hi,

Unfortunately there are no settings for height of flex block, you can st it only using custom css -> https://i.imgur.com/e8dUVVd.png
.td_module_flex_1 .td-module-meta-info{
height: 400px
}
.td_module_flex_1 .td-module-meta-info .td-read-more{
position: absolute;
bottom: 10px;
}

The code will be apply on all flex block 1 so to make it to apply only on flex you want you can add an extra class -> https://i.imgur.com/wFv7l5V.png and the code will be
.my-class .td_module_flex_1 .td-module-meta-info{
height: 400px
}
.my-class .td_module_flex_1 .td-module-meta-info .td-read-more{
position: absolute;
bottom: 10px;
}

The code need to be set in theme panel> custom code> custom css.

Hope this will help you!
Thank you!

Post count: 95

Thanks Calin! Sorry for the delay.

I am using the second version only where I need it, I have also applied the class to Posts Loop of the categories (applying the class to the Template), but I don’t see the same result that I get in Home where I have the simple Flex Block 1.

How can I also apply your CSS to the Posts Loop?

Post count: 35449

Hi,

For post loop you can use this custom css:
.my-posts-loop-class .td-module-meta-info{
height: 400px
}
.my-posts-loop-class .td-module-meta-info .td-read-more{
position: absolute;
bottom: 10px;
}

Hope it will help you!
Thank you!

Post count: 95

Great, thanks!

Viewing 7 posts - 1 through 7 (of 7 total)
You must be logged in to reply to this topic.