Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • April 3, 2017 at 2:50 pm #771152
    GregA

    Hello,

    I’m trying to get a Price table that keeps the same height of the cells whatever the size of the screen.
    In order to do it, i suppressed the padding and set a minimum height :
    .pricing-table>li {
    min-height: 42px;
    padding: 0px; }

    It’s working great, but now i would like to vertically align all the text…
    Any idea ?

    Thanks in advance :)

    Greg

    April 5, 2017 at 7:31 pm #772779
    Andy

    Hey GregA,

    try this code inside Quick CSS field:

    td {
vertical-align: top !Important;
}

    Best regards,
    Andy

    April 10, 2017 at 10:47 am #775364
    GregA

    Hi Andy,
    Thanks for your answer but it’s not exactly what i want :)
    I would like to vertically align in the middle all the icons and text.
    and td {vertical-align: middle !Important; } is not working ;)
    Thanks in advance,
    Greg

    April 11, 2017 at 11:38 am #775949
    Andy

    Hi,

    try this code:

    .pricing-table>li {
padding-top: 10px;
}

    Best regards,
    Andy

    April 11, 2017 at 12:08 pm #775965
    GregA

    Hello Andy,
    I already tried like this unfortunately, the table is not anymore responsive : http://hpics.li/c166c9d
    The idea is to supress the padding and set a minimum height so when the text comes on 2 lines (when the table is small), the cells height don’t change.
    What i would need, is to : vertically align in the middle everything inside the

  • .
    Do you know any way ?
    Thanks.
    Greg
April 12, 2017 at 2:46 pm #776671
Andy

Hi,

I checked your table together with the padding-top code I provided and it looks good on mobile. A precise link showing the issue and/or screenshots would help. This is what I see when I use my code from above: http://i.imgur.com/gLTuoQu.png

Best regards,
Andy

April 13, 2017 at 11:03 am #777172
GregA

Hello Andy,

On wide screen and on mobile the table is indeed good.
The problem appears on a medium size screen, when the text comes on 2 lines and change the size of the cells.
Please find the exemple on the link : http://hpics.li/970cac1

Regards,
Greg

April 14, 2017 at 6:04 pm #777932
Andy

Hi,

what means medium size screen for you? on which device is this happening exactly? Have in mind that “responsive” does not mean that it works well on every screen size for desktop, but on every mobile device. However you can work with media queries to achieve what you want with my code. Just wrap the media queries around my code.

Gruß,
Andy

  • Author
    Posts
    • Viewing 8 posts - 1 through 8 (of 8 total)
    • You must be logged in to reply to this topic.