Same size markdown blocks

Site URL: https://www.signal-sigma.com/pricing

Hi there,

I'm in the early process of designing a features & pricing page. I'd like the user to scroll down through the features sections (designed with a split screen plugin) and end up at the 3 member plans which I have designed using markdown blocks.

Some browsers with a smaller screen load these 3 blocks unequally. Also, I would like them to contain less text, but I have intentionally put in almost the same number of characters so that they would show up equal lenght. Any help would me much appreciated.

Thanks,

Andrei

It looks fine on some screen sizes. On tablet, it still doesn't equal. Do you still need help?

I've played around with css settings for different size screens and got them to align.

But it's a patchy solution, it does not guarantee they will align.

Any ideas how to make them align on any screen size?

Many thanks!

On 3/24/2022 at 10:55 PM, Soty said:

I've played around with css settings for different size screens and got them to align.

 

But it's a patchy solution, it does not guarantee they will align.

 

Any ideas how to make them align on any screen size?

 

Many thanks!

Hi. Which screen sizes do you see problem? or tablet only? I can tweak the code easier

@tuanphan, tablet (vertical orientation) still has issues.

Thank you for looking into it!

On 3/26/2022 at 5:52 PM, Soty said:

@tuanphan, tablet (vertical orientation) still has issues.

Thank you for looking into it!

Add to Design > Custom CSS

/* Equal pricing table */
@media screen and (max-width:1024px) and (min-width:768px) and (orientation:landscape) {
div#block-yui_3_17_2_1_1645544593302_46939+.row .markdown-block {
    min-height: 850px !important;
}
}

Thank you @tuanphan!! 🙏🏻