- This topic has 6 replies, 2 voices, and was last updated 6 years, 6 months ago by
.
Hello,
I’m using the pricing table module and have the following problem:
1. On devices with a lower resolution (iPad etc.), the length of the tables is very different than on regular resolutions (see screenshots).
I’ve already changed the font size of the title, but that doesn’t seem to help.
Can I somehow give the part of the element with the title a fixed height to make sure that the table columns all have the same height?
2. On devices with lower resolutions, longer words in the title get cut off (see screenshot, “Communicate”). How can I avoid this?
I’m thankful for any help!
Best,
SimonHi Simon,
I hope you are well today and thank you for your questions.
You can resolve it by adding the following CSS code in the Custom CSS code option of your theme on the below path.
Admin Area -> Appearance -> Theme Settings -> Custom Code -> CSS Code
@media (max-width:1252px){ #page-container .sh-pricing-top .sh-table-cell { word-break: break-word; } #page-container .sh-pricing-top { min-height: 275px; } }Best regards,
Shufflehound teamGreat, that seems to work. Can I do the same for the second part of the element? Thank you!
Seems to work with
#page-container .sh-pricing-content-item {
min-height: 475px;
}How about changing the font size in the content part of the element?
I tried the following, without success:
#page-container .sh-pricing-name body{ font-size: 23px; font-weight: 100; }
#page-container .sh-pricing-content-item body{ font-size: 13px; font-weight: 100; }
Thank you!
Found a solution (YellowPencil). Still, it seems impossible to find a height that looks good on mobile and desktop.
You can try achieving this using Yellow Pencil editor as described in the below page.
https://support.shufflehound.com/how-to-change-almost-any-element/
