Viewing 10 posts - 1 through 10 (of 10 total)
  • Author
    Posts
  • July 31, 2016 at 10:13 pm #667060
    frysjo

    Hi Kriesi,
    I really like your theme! I’m trying to get the grey button (“Zjistit více”) and the image (the yellow video icon) to the same line (see the image below). Is there any way how to do it?

    Best regards!

    • This topic was modified 8 years, 3 months ago by frysjo.
    August 1, 2016 at 3:55 am #667114
    Vinay

    Hey frysjo,

    Thank you for the kind words. We will gladly help you Would you mind providing a precise link to your site, showing the elements in question? We need to be able to inspect them in order to help :)

    Best regards,
    Vinay

    August 1, 2016 at 6:50 am #667126
    frysjo

    Here is the link: http://gympb.cz/_piskoviste/

    August 1, 2016 at 4:17 pm #667335
    frysjo

    There is one more idea: the yellow button (actually the image element) can be truly button (button element). But when I tried it, the icon in the button was too small.

    August 1, 2016 at 7:04 pm #667410
    Yigit

    Hi!

    You can choose to display your icon your button and then add following code to Quick CSS in Enfold theme options under General Styling tab to increase its size 

    .avia_button_icon {
    font-size: 20px;
}

    Best regards,
    Yigit

    August 1, 2016 at 8:03 pm #667433
    frysjo

    Yeah, but this code enlarges also the icon in the grey button

    August 2, 2016 at 11:35 am #667584
    Yigit

    Hi,

    If you would like to apply the changes to certain elements, please turn on custom CSS field for ALB elements – http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ and edit your button and give it a custom CSS class and use the code as following

    .your-custom-class .avia_button_icon {
    font-size: 20px;
}

    Best regards,
    Yigit

    August 3, 2016 at 8:42 am #667943
    frysjo

    Hi, it’s almost done! :-) My last question is how can I set the width of the button (it should has a 1:1 ratio)? I’ve tried this code that I found on the forum, but without success.

    .button-video .avia_button_icon {
    font-size: 18px;
    min-width: 45px; 
    width: 45px;
    max-width: 45px;
}
    • This reply was modified 8 years, 3 months ago by frysjo.
    August 3, 2016 at 12:54 pm #667982
    Vinay

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    .button-video a  {
    min-width: 20px!important;
    width:20px!important;
}

    Best regards,
    Vinay

    August 3, 2016 at 7:05 pm #668220
    frysjo

    As you can see, it works! Thank you for your time :-)

  • Author
    Posts
Viewing 10 posts - 1 through 10 (of 10 total)
  • The topic ‘Button and image on the same line’ is closed to new replies.