Tagged: 

Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • February 22, 2015 at 5:35 am #400179
    Jasmer

    I am having difficulty with the pricing table.

    When you resize the browser window to make it smaller the buttons and the $Text do not resize properly. They stay the same size and go outside the pricing box.

    This problem also occurs when I view the site on an iPad 2. The numbers and the buttons bleed outside the box.

    Thank you for your help!

    February 22, 2015 at 11:52 pm #400306
    Josue

    Hi Jasmer!

    I’d suggest reducing the font-size when the screen gets smaller:

    @media only screen and (max-width: 1024px) {
    .pricing-table > .avia-pricing-row:nth-child(2) {
        font-size: 28px;
    }
}

    Cheers!
    Josue

    February 23, 2015 at 9:38 am #400455
    Jasmer

    Hi Josue,

    But how would changing the font size keep the button inside the pricing box? Did you see that? The button bolds over as well.

    Thanks

    February 23, 2015 at 10:27 am #400478
    Jasmer

    I tried that. The CSS is active now. It doesn’t work.

    Thank you

    February 23, 2015 at 4:55 pm #400774
    Josue

    Hi,

    It doesn’t work because there is a typo in the code, don’t copy the code from the mail notification but from the forum reply.

    Cheers!
    Josue

    February 24, 2015 at 7:17 am #401192
    Jasmer

    Hi Josue,

    That solves one problem. The buttons still remain the same size and bleed off the pricing box. I don’t understand why it would be designed this way? Can you explain to me why the buttons don’t automatically resize with the pricing box?

    Thank you for your help!

    February 24, 2015 at 8:12 am #401202
    Josue

    Hey Jasmer,

    Try adding this:

    @media only screen and (min-width: 768px) and (max-width: 1200px) {
    .avia-button.avia-size-large{
        padding: 10px !important;
        min-width: inherit !important;
    }
}

    Cheers!
    Josue

    February 24, 2015 at 8:25 am #401205
    Jasmer

    It’s not James it’s J A S M E R ;)

    BANG! That worked. Question. Do the pricing table elements normally bell outside the bounding box? Is it because I have 5 boxes and that is quite a lot? Or did I add some code earlier that caused this? If not, wouldn’t this be a good thing to update in the next release of Enfold?

    THANK YOU

    February 24, 2015 at 9:31 am #401225
    Josue

    No, it is that the Big Button style doesn’t seem to play nicely on mobiles when using a lot of columns (5+), because of a min-width rule.

    Regards,
    Josue

    February 24, 2015 at 1:32 pm #401384
    Jasmer

    Thank you Josue!

    February 24, 2015 at 3:03 pm #401444
    Günter

    Hi!

    Glad we could help you. Enjoy the theme.

    Regards,
    Günter

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)
  • The topic ‘Pricing Table’ is closed to new replies.