CSS Klasse ansprechen nicht möglich

  • Hallo zusammen,


    ich bin recht neu in der CSS Materie und versuche gerade ein Element aus meinem Online Shop anzupassen, aber es will mir einfach nicht gelingen

    Der Selektor aus den DEV Tools kopiert sieht wie folgt aus:

    Code
    #paypal-animation-content > div.paypal-button-container.paypal-button-layout-vertical.paypal-button-shape-rect.paypal-button-branding-branded.paypal-button-number-multiple.paypal-button-env-sandbox.paypal-should-focus > div.paypal-button.paypal-button-number-1.paypal-button-layout-vertical.paypal-button-shape-rect.paypal-button-branding-branded.paypal-button-number-multiple.paypal-button-env-sandbox.paypal-should-focus.paypal-button-label-elv.paypal-button-color-silver.paypal-button-logo-color-black


    Wie muss ich den in mein CSS File kopieren, damit ich entsprechend Anpassungen darauf machen kann? Weil so funktioniert es leider nicht. Wenn ich die Anpassungen direkt in der Konsole über diesen Selektor mache und in element.style eintrage, dann funktioniert die Änderung.


    Danke euch schon mal :)

  • kannst du uns mal ein Link geben, weil so kann man dir nicht viel helfen.

    Du könntest es auch noch mit !important versuchen , doch ob das geht kann ich dir jetzt so nicht sagen

    Hallo basti, vielen Dank für deine Antwort.


    Leider nein, da die Seite nicht live ist.

    !important hat keine Auswirkung. Ich glaube das Problem besteht darin, dass der Selektor nicht korrekt ist.


    Aber vielleicht hilft der Screenshot. Im Screenshot habe ich es direkt über die Konsole ausblenden können.

    Ich bin auch in der Lage beide Buttons (Paypal & SEPA) auszublenden über .paypal-button. Aber nur einen auszublenden bekomme ich nicht hin.

  • ich kann auf den Bildern nix erkennen weil mein Bildschirm nicht der größte ist.

    Du könntest deinen Code auch mal bei codepen.io rein kopieren damit man dein problem auch mal Live sehen kann.


    Ich würde das mal so versuchen falls ich das so richtig gesehen habe

    Code
    #paypal-animation-content  div.paypal-button-container .paypal-button-logo-color-black{
      
    display:none
    }

    falls das nicht geht kopiere dein html Code mal hier rein.

    Du machst rechts klick bei der id #paypal-animation-content und gehst auf Copy outer Html.


    Du kannst dir aber auch den richtigen (Selector Pfad ) von der Console anzeigen lasse

  • Hallo Basti.


    Danke dir vielmals für deine Antwort.


    Mit deiner Variante hat es leider nicht funktioniert. Hier einmal der Codeausschnitt: https://codepen.io/clemy49/pen…IDNfLtpSImp2i0eBN_TpnyWkE


    Die anzusprechende Klasse wäre diese. Aber darauf reagiert der Button in keinster Weise, wenn ich es in mein Custom CSS in Wordpress eingebe.

    Code
    class="paypal-button paypal-button-number-1 paypal-button-layout-vertical paypal-button-shape-rect paypal-button-branding-branded paypal-button-number-multiple paypal-button-env-sandbox paypal-should-focus paypal-button-label-elv paypal-button-color-silver paypal-button-logo-color-black"
  • Wenn ich diesen Code in den Css Fenster rein kopiere funktioniert es

    Code
    .paypal-button.paypal-button-number-0.paypal-button-layout-vertical.paypal-button-shape-rect.paypal-button-branding-branded.paypal-button-number-multiple.paypal-button-env-sandbox.paypal-should-focus.paypal-button-label-paypal.paypal-button-color-gold.paypal-button-logo-color-blue {
        background: red;
    }

    auch das würde gehen

    Code
    .paypal-button.paypal-button-color-gold.paypal-button-logo-color-blue {
        background: red;
    }

    oder sogar das

    CSS
    .paypal-button{
      background:green !important;
    }

    Diese Css steht aber unter aller anderen Css und überschreibt ggf andere style angaben.

    Wenn das auch nicht geht dann brauch solltest du vieleicht mal deine Seite online stellen.


    Wahrscheinlich ist da noch was anderes was stören könnte das man jetzt nicht so sehen kann

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!