Support Center Visit Demo License manager Buy @ envato

Button text overflows icon now

MAF1981MAF1981
edited September 2020 in Shortcodes
Hey there,

not sure during which update this happened, but for all my buttons using an icon the text overflows the icon. Before, it looked fine.
See an example on my main page: https://isardomains.com/ (check below the header image, there are two buttons generated by the shortcode, on is "Domain-Portfolio anzeigen" and the other one is "Aktuelle News"). For both, the text starts already within the icon. 
However, this is not only related to the shortcode. I've another page generating a button through the Promopage widget. This has the same result. You can check this on this subpage: https://isardomains.com/ueber/ (scroll down, the button is the last element of the content, labelled with "DNAcademy besuchen".
 
This is the shortcode of one of the buttons on my main page:
[button title="Domain-Portfolio anzeigen" link="/portfolio" target="" icon="icon-cart" icon_position="left" color="" font_color="" size="2" full_width="0"] 

Any thoughs?
Thanks!

Comments

  • PabloPablo
    Hello,
    Can you check, if it works fine when all of your plugins are disabled?
    Also, is your WP, BeTheme and all of the plugins up to date?

    Thanks
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • MAF1981MAF1981
    Nope, not working even if I disable all plugins (deleting cache, also verified with a different browser). 
    WP-Version: 5.5.1
    BeTheme Version: 21.8.5.1

    What I've identified is, that there is a CSS class missing which is responsible to add the margin. The class is "has-icon". This does not show up anymore by the generated HTML code?

    This is what I use as shortcode:
    [button title="Domain-Portfolio anzeigen" link="/portfolio" target="" icon="icon-cart" icon_position="left" color="" font_color="" size="2" full_width="0"] 

    This is what I get on the page:
    <a class="button  button_left button_size_2 button_js" href="/portfolio"><span class="button_icon"><i class="icon-cart"></i></span><span class="button_label">Domain-Portfolio anzeigen</span></a>

    Now, if I add the has-icon class after button (and before button-left) for the <a> tag, it appears correct. There are also 2 spaces between the both button classes in the generated HTML code which looks for me like there is something missing. Thoughts?

    Hint: I add the above shortcode within a "Visual Editor" item in the Muffin Builder. But why I face the same behavior also for the button in the Promo widget... I dont know. 
  • PabloPablo
    Can you disable the plugins which are responsible of minifying and caching the website?
    Right now, I'm not able to look at the CSS code :(

    thanks
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • MAF1981MAF1981
    Yes, I've now disable the related plugins again (Autoptimize and W3 Total Cache).
  • PabloPablo
    Hey,
    Please send us WordPress dashboard access privately thru the contact form which is on the right side at http://themeforest.net/user/muffingroup#contact and we will check what might be the reason.
    Notice!
    Please attach a link to this forum discussion.
    Thanks
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
  • MAF1981MAF1981
    Ok, done.
  • PabloPablo
    This is caused by your modifications of the child theme.
    After switching the theme to parent it does work correctly.

    Thanks
    Learn more: Video Tutorials | How To | FAQ Vote on what comes next
Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Neccessary

Necessary cookies help make a website usable by enabling basic functions like page navigation and access to secure areas of the website. The website cannot function properly without these cookies.

Analytics & Performance

Statistic cookies help website owners to understand how visitors interact with websites by collecting and reporting information anonymously.

Marketing

Marketing cookies are used to track visitors across websites. The intention is to display ads that are relevant and engaging for the individual user and thereby more valuable for publishers and third party advertisers.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.