Farbe der Sprechblase uneinheitlich

tklustig

Erfahrenes Mitglied
Hallo Leute,
durch folgenden Code erzeuge ich dynamisch eine Sprechblase. Leider ist die Hintergrundfarbe der Sprechblase nicht einheitlich, sondern verschiedenfarbig. Weiß jemand Abhilfe? CSS(fix)
CSS:
    .speech-bubble {
        background: yellow;
        position: absolute;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px;
    }
    .speech-bubble:before {
        content:"";
        position: absolute;
        width: 0;
        height: 0;
        border-top: 13px solid transparent;
        border-right: 26px solid #037CA9;
        border-bottom: 13px solid transparent;
        margin: 13px 0 0 -25px;
    }
JQuery(dynamisch)
Javascript:
      $(document).ready(function () {
            $("#speech-bubble").css({
                position: "absolute",
                width: "320px",
                height: "120px",
                right: "50%",
                top: "60%"
            });
            $("#speech-bubble").html("<p>Folgende Parameter werden in das Matching integriert:</p>");
        });
HTML
HTML:
    <div class="speech-bubble" id="speech-bubble">
    </div>
bubble.jpg
 

Sempervivum

Erfahrenes Mitglied
Ich nehme an, Du meinst, dass die Farbe des Pfeils anders ist als die des Kastens. Das lässt sich leicht beheben, indem Du dem Pfeil die selbe Farbe gibst (border-right):
CSS:
        .speech-bubble:before {
            content: "";
            position: absolute;
            width: 0;
            height: 0;
            border-top: 13px solid transparent;
            border-right: 26px solid yellow;
            border-bottom: 13px solid transparent;
            margin: 13px 0 0 -25px;
        }
 

tklustig

Erfahrenes Mitglied
Yuup. Vor lauter Bäumen den Wald nicht gesehen. Thx for this information.
Wie kann ich diesen Thread als gelöst markieren? Der entsprechende Button fehlt seit Neuestem