Vertical align for Plan cells

Hi,

Thanks for the link to your website but it seems that your page is private – could you change the status of your test page for us to see it and provide you with the necessary css you could use.

So sorry; I hadn’t realized the subpages were protected also. That one is now set to Public.
Thx.

Thanks I’m now able to see the tables and titles now seem to be centered on the page.

Is there anything else we may assist you with?

Actually, centering on the page wasn’t the issue, it was centering the single-line Plan titles vertically within their divs.

More specifically, the single-line Plan titles – in this case, “Market Analysis” and “Employee Research” – are floating toward the top of their respective divs. I’m looking to have them centered vertically in those divs.

No css tricks that I tried have worked.

Please try the adding the below CSS into your Pricing table’s custom css or in your theme style.css

.ptp-price{display:none !important;}
.ptp-plan{
    vertical-align: middle!important;
min-height:90px!important;
}

—
Rashaan

Tried your suggestion but it didn’t work.

The pricing field was hidden but I see that the single line text are still not vertically centered.

An alternative method for only the single line text try surrounding them in div tags and add this inline css.

For example:
<div style="margin: 16px 0;">Employee Research</div>

—
Rashaan

Actually I hid the pricing field when I originally built the table, so I didn’t need to add more code to do that.

The inline css worked well for centering the single-line headings, so thank you. It even worked for centering them in a mobile device view.

However, I also applied it to the headings that were long enough to break into two lines, since they had been hovering at the top of the div when viewed horizontally on a mobile device. They now are centered when viewed horizontally, but hover at the bottom of the div when viewed vertically.

I’m not understanding why this happens when the copy in the individual Plan Features cells centers just right no matter the device or orientation.

Hi Grillin,
I’m not sure what is causing some of the headers to be displaced on different views but this might be related to CSS conflicts with theme as well.

—
Rashaan