Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • June 6, 2018 at 6:47 am #967659
    joerg-s

    Hello everyone,
    1st I must admit that I am not familiar with writing CSS code… Biut I can understand if someone guides me :-)
    Could you please tell me how I can control the font sizes of buttons and form fields?
    Thx for helping!

    June 7, 2018 at 6:42 am #968192
    Rikard

    Hey Joerg,

    Could you post a link to your site and point out what you would like to change there please?

    Best regards,
    Rikard

    June 7, 2018 at 7:31 am #968209
    joerg-s

    Hi Rikard,

    unfortunately this happens in the shop area (Woocommerce + Germanized Pro + WPML), so you first must add a product to the cart to see this behaviour: http://www.beauty-pad.com/shop.

    How can I enclose attachments (screenshots) here?

    Thanks, Jörg

    June 7, 2018 at 1:25 pm #968740
    Rikard

    Hi Jörg,

    Thanks for that, so it’s the font size of the buttons on the cart page you are looking to edit? If so, which of the buttons are the correct font size?

    Best regards,
    Rikard

    June 7, 2018 at 1:53 pm #968774
    joerg-s

    Hello Rikard,

    right – the buttons AND the input fields that have this very small font (e.g. “Gutscheincode” or “Gutschein anwenden”). Font size of “Weiter zur Kasse” would be correct. I don’t know why the font sizes differ between the different buttons and where to configure them.

    Regards, Jörg

    June 8, 2018 at 7:02 am #969967
    Rikard

    Hi,

    Thanks for the feedback. Please try the following in Quick CSS under Enfold->General Styling:

    .woocommerce-cart-form__contents button, .woocommerce-cart-form__contents .input-text {
  font-size:18px !important;
}

    Best regards,
    Rikard

    June 8, 2018 at 7:34 am #969989
    joerg-s

    Hi Rikard,

    this worked, thank you!

    Regards, Jörg

    • This reply was modified 6 years, 6 months ago by joerg-s.
    June 9, 2018 at 8:07 am #970305
    Rikard

    Hi Jörg,

    Great, glad we could help. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

    June 9, 2018 at 11:46 am #970381
    joerg-s

    Hi Rikard,

    well there are several other button and field elements where these changes don’t take effect. I played around a little bit with CSS tutorials and the browser’s code inspector on the cart page to get more familiar with this, but I must say right now it*s still confusing and not easy to understand the CSS syntax.

    I don’t expect that you teach me CSS, but maybe you could explain some questions I have with your code example:
    .woocommerce-cart-form__contents button, .woocommerce-cart-form__contents .input-text {
    font-size:18px !important;
    }

    button and input-text obviously are the CSS classes. But why has input-text a leading “.”, and button not?
    Where is .woocommerce-cart-form__contents coming from?

    There are a lot of elements that need also to be worked at, so if I would understand the basics here, I could go on by myself.

    Thanks a lot!

    Jörg

    June 10, 2018 at 7:05 am #970629
    Rikard

    Hi Jörg,

    If we look at this code:

    .woocommerce-cart-form__contents button, .woocommerce-cart-form__contents .input-text {
font-size:18px !important;
}

    This is a class, everything which starts with a . is:

    .woocommerce-cart-form__contents

    If it doesn’t start with a . or a #, then it’s an html element:

    button = <button>Some content</button>

    Hope that makes things more clear :-)

    If you want to learn more about CSS then I can recommend W3 Schools which have good resources. I appreciate that you are trying to learn though, a lot of users on the forum tend to use us for all their changes.

    Best regards,
    Rikard

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