Woocommerce winkelwagen zet elementen door elkaar.

[Patje76!]

Voor het afrekenen in Woocommerce heb ik de Tikkie plugin geïnstalleerd.
Deze plugin werkt op alle pagina's van mijn webwinkel, echter in de winkelwagen wordt de button niet goed getoond.

Hier zie je wat er nu wordt getoond https://i.imgur.com/SiDDF5T.png
De paarse balk hoort bij het € teken te staan onder doorgaan naar afrekenen.
Volgens de plugin bouwer van Tikkie komt het doordat er elementen rond de Tikkie button staan die niet goed gestyled zijn.

Via de Google Chrome developers tool ben ik er wel achter gekomen welk element ik moet verplaatsen, maar ik weet niet waar ik dit in de CSS moet doen.

Voor verplaatsing https://i.imgur.com/70wSlpB.png
Na verplaatsing https://i.imgur.com/JzpVC2e.png


Ik gebruik Wordpress 5.1 / Woocommerce 3.5.6 / PHP 7 met als thema 8Theme - Woopress

Ik hoop dat iemand mij een tip kan geven waar ik dit aan zou moeten passen.

[TERW_DAN]

Je moet zorgen dat de style op de div met class .tikkieBtn goed staat. Maar omdat in je screenshots niet zichtbaar is wat daar het verschil tussen is is het lastig om te zeggen wat er nu precies niet klopt.

[Patje76!]

Volgens mij staat de style goed, maar gaat er iets fout met de div .wc-proceed-to-checkout, het lijkt er namelijk op dat de tikkiebutton gedeeltelijk in deze div geplaatst wordt.
De pagina waar het over gaat is *snip* niet de bedoeling

[ Voor 11% gewijzigd door RobIII op 11-03-2019 19:56 ]

[TERW_DAN]

Misschien handig om 't stukje relevante code te posten. Dan is er misschien iets zinnigers over te zeggen.

[Patje76!]

Na lang zoeken en proberen heb ik eindelijk een vrij simpele oplossing. In de instellingen van de plugin heb ik de automatische functie "tonen op winkelwagenpagina" uitgevinkt en een stukje php toegevoegd aan cart.php

PHP:

<div class="tikkieBtn " data-productid="" data-type="">
        <span class="normal">
            <span class="label">Supersnel betalen met</span>
            <img src="https://www.(mijn webwinkel).com/wp-content/plugins/woocommerce-tikkie-fast-checkout/assets/img/logo.svg">        </span>
        <span class="anim">
            <div class="dot-1"></div><div class="dot-2"></div>
        </span>
    </div>